Drop an SVG file
or click to pick one

svg-to-msdf

load PNGs →
SVG → MSDF (per-color layer) · Three.js / R3F
File
Texture256 × 256 px
Layers
Total edges
VRAM (RGBA8)
Bake time
Resolution256px

Per-layer texture size. Higher = sharper corners and more VRAM. MSDFs scale well, so 128–256px is usually enough.

SDF range4.0

Distance band (in SVG units) encoded around each edge. Wider = smoother outlines and effects (glow, outline) but coarser corners. 4 is a sensible default.