Skip to content
Y
☰

Text to SVG

Your text is read from the chosen font’s glyph outlines and turned into a single SVG <path>. No font name or <text> element is left in the file, so you get a vector that looks the same in every app — for logos, cutting, print and the web. The viewBox hugs the drawing, and you can add padding if you need it.

Your content is processed in your browser and is not uploaded.

Settings

96 px
0 px
1.2×

Alignment

Appearance

0 px
0 px
2 digits

Preview

Loading font…

SVG code

Letters are read from the chosen font and drawn as a single <path>; the file has no <text> element or font link, so it looks the same in every app. The viewBox starts at 0,0 and hugs the drawing; raise the padding if you want space around it.

Your content is processed in your browser and is not uploaded.

How it works

  1. Type your text; multiple lines are fine.
  2. Pick the font, size, letter and line spacing, and alignment.
  3. Set fill and stroke colors, stroke width, padding and background.
  4. Download the SVG or copy its code; download a transparent PNG at 1×, 2× or 4× if needed.

Examples

  • Logo lettering → a single-path SVG that needs no font
  • Outline only with “No fill” for vinyl or laser cutting
  • Website heading → the same look without loading a font file

Tips

  • Padding defaults to 0, so the SVG ends exactly at the letters. When you add a stroke, half its width is included automatically so it is never clipped.
  • With thick strokes, “Draw the stroke behind the letters” keeps the counters of the letters open.
  • Lowering the decimal precision makes the file smaller; at large sizes one digit is usually enough.

Path SVG versus <text> SVG

An SVG using <text> only names the font; if the device opening it lacks that font, another one is used and the look changes. This tool reads the letter outlines straight from the font file and turns them into coordinates. The result is a drawing that needs no font at all.

The output is a single <path> that opens directly in apps such as Illustrator, Inkscape, Figma or Cricut Design Space, where you can recolor and scale it. Because it is no longer editable text, regenerating it here is the easiest way to make changes.

Why a tight viewBox starting at 0,0?

The drawing is moved so its top-left corner sits exactly at 0,0, and the viewBox width and height match the real bounds of the letters. When you drop the SVG into a design there is no invisible margin, so alignment and sizing work from the edges of the letters.

The bounds use the true extremes of the curves, so control points do not enlarge the box. If you need space, the padding setting adds an equal margin on all four sides.

Frequently asked questions

Do Turkish letters work?

Yes. Every font in the list was checked for upper and lower case ç, ğ, ı, İ, ö, ş and ü. If you type a character the font lacks (such as an emoji), the tool warns you and that character is drawn as a box.

Can I use the fonts for commercial work?

The fonts in the list are distributed under the SIL Open Font License (OFL). It lets you use what you create with them — logos, labels, prints — in commercial work. Selling the font files themselves is not allowed.

Is my text sent to a server?

No. The font file is downloaded from our site and the conversion runs entirely in your browser. Your text is not sent to or stored on a server.

What size is the file?

The SVG dimensions are in pixels and shown above the preview. Being vector, the SVG scales to any size without losing quality; for PNG, 2× or 4× gives a sharper result.

Related tools