Convert text to SVG vector path. Upload a font for true outline paths, or fall back to SVG text with system fonts.
✒️ SVG preview SVG text mode
SVG code
CSS inline usage

How to use

  1. Enter text, size, color.
  2. For exact outline paths, upload a font file (.ttf/.otf/.woff/.woff2).
  3. Without upload, SVG text element renders instantly.
  4. Download SVG or copy the code.

Key features

  • 2 modes: Outline path (font uploaded) · SVG text (system font)
  • .ttf / .otf / .woff / .woff2 all supported
  • Custom color / background / size
  • SVG download + code copy
  • CSS inline usage snippet

Use cases

  • Logo design — text logo visible without font installed
  • Icon libraries — letter-shaped icons as SVG
  • Print graphics — exact letterforms without font embedding
  • CSS masks — source for clip-path / mask-image
  • SVG animation — stroke-dasharray letter-drawing effect

Outline path vs SVG text

Outline path converts letterforms to actual SVG <path> data. Renders identically anywhere without the font installed — equivalent to Illustrator's "Create Outlines". SVG text uses <text> which falls back to another font if the user's device lacks it. Outline = more accurate; SVG text = smaller file.

FAQ

Why upload a font?

SVG path outline needs glyph data from the font file. Browsers can't access system fonts for path extraction.

CJK fonts?

Yes, opentype.js supports CJK. Note: CJK font files are large (10–30MB).

Commercial fonts?

Depends on the EULA. Some commercial fonts forbid outline conversion. Check the license.

Free?

Yes, all processing in browser.