How do I convert text to SVG paths?

Set the type with the text tool in the editor, then flatten it to outlines. The letters stop being a font reference and become closed geometry — which is what you want the moment the file leaves your machine, because the recipient almost certainly does not have your font installed.

What is the difference between SVG text and SVG paths?

A element keeps the letters live: still editable, still searchable, still selectable — and still dependent on the font being available wherever it renders. Outlined text is the same letters converted to path data: no longer editable as words, but guaranteed to look identical everywhere. Live for a web page you control, outlined for anything you hand to someone else.

Does this actually write SVG, or does it trace a generated image?

It writes vector output directly. There is no PNG in the middle to trace, which is why the file comes back with closed shapes and smooth bezier handles rather than the thousands of jagged points a tracer produces.

Can I use my own font?

Yes, provided its licence allows it. Once you flatten the type to outlines the font file itself is no longer part of the SVG — but embedding or outlining a typeface is still a licensing question, and a few foundries restrict exactly this. Check the EULA before you outline a commercial face for a product you sell.

Can I make curved text as SVG?

Yes, two ways. Live text can follow a path with a element referencing any path in the file, which stays editable. Or draw the curve, run the type along it, then outline the result — which is what you need if the file is going to a cutter or to anyone without your font.

Why does Cricut or my laser cutter need text converted to outlines?

Cutting software cuts paths, not typography. A element gives it nothing to follow, so the letters either vanish on import or come in as a box. Outline the type first and each letterform becomes a closed shape the machine can trace — which is also why counters, the holes in a and o, need checking before you send it.

Can ChatGPT make an SVG file?

It can emit SVG markup, and for a handful of primitives that works. What it does not do reliably is produce coherent multi-shape artwork — the paths tend to be plausible-looking coordinates that do not close, overlap correctly or align. The output here is built to be geometry rather than text that resembles geometry, which is why it opens in an editor with anchors you can actually drag.

How long is a good prompt?

Two to three sentences. Name the subject, the style, the palette and the background. Your prompt is expanded automatically before generation, so you are giving direction rather than writing the full spec yourself.

A free account gets a credit on sign-up with no card. Generation spends credits; setting type, outlining it, editing and exporting do not.

Can I edit the result?

Yes. Every generation opens in the editor, where you can drag anchor points, move bezier handles, recolour fills, rename layers and delete shapes you do not want.

What size is the output?

Generation runs at 1024 x 1024 by default. Because the result is vector, that number is only the coordinate space — the graphic renders sharp at any size, from a 16px favicon to a billboard.

Do I own what I generate?

Yes — royalty-free, worldwide, commercial use included, with no attribution required. See the licence page for the full text.

Text to SVG

Text to SVG: type a sentence, or outline your type.

A prompt goes in; closed shapes, smooth bezier handles and named layers come out. Or bring your own words and flatten them to paths for a cutter. Not a picture of a vector — the actual path data, on screen, before you commit it to a repo.

Free credit to start · no card required · outlining costs nothing

Generate an SVG Open the editor

One free credit on sign-up · no card

prompt1024 × 1024

faceted fox head, flat vector, burnt orange and teal facets, transparent background

output

<g id="ears">
  <path d="M22 34 L50 20 L78 34 Z" fill="#F25C05"/>
</g>
<g id="muzzle">
  <path d="M28 78 C40 88, 60 88, 72 78" fill="#0F8A7E"/>
</g>

paths: 12
nodes: 204
size: 8.1 KB

Same phrase, two jobs

Which kind of text to SVG did you mean?

People arrive here wanting two entirely different things, and a third that gets confused with both. Take the one that matches and skip the rest.

Meaning one
A prompt into artwork
You describe a graphic — a fox mid-stride, a folded map pin, a monoline coffee cup — and get vector geometry back. The text is a brief, not content. This is what the rest of this page is mostly about.
Generate from a prompt
Meaning two
Type into outlines
You have words — a wordmark, a name, a quote for a cut file — and you need the letterforms as paths rather than as a font reference. Set the type, flatten it, and each glyph becomes closed geometry.
Open the editor
Neither, quite
The <text> element
Live text inside an SVG stays editable, selectable and searchable, and stays dependent on the font existing wherever it renders. Right for a page you control; wrong for a file you hand to someone else.
Typography in SVG

What happens to your sentence

Three passes between the prompt and the file.

The prompt is expanded

Your sentence is rewritten into a full art direction brief — subject, composition, palette, stroke behaviour, mood. If you did not mention a background, transparency is stated explicitly so nothing paints a rectangle behind your artwork.

Geometry is written

A vector model lays down closed shapes with smooth bezier handles. Because it is generating paths rather than pixels, a typical icon lands in tens of shapes instead of the several hundred a bitmap tracer would produce.

The markup is cleaned

Editor namespaces are stripped, decimal precision is trimmed to what each curve actually needs, and groups that only nest other groups are unwrapped. You get the file you would have hand-tidied anyway.

Prompt anatomy

Six slots decide what the file looks like.

You do not have to fill all six. But each one you leave empty is a decision the model makes for you — and the background slot is the one people regret skipping.

Read the full prompt guide

Prompt components and their effect on generated SVG output
Slot	Example	What it changes
Subject	a faceted fox head	Decides the shape count. Concrete nouns resolve; abstractions sprawl.
Style	flat vector, geometric facets	Chooses between fills and strokes. Flat styles give fewer, cleaner paths.
Palette	burnt orange, teal, cream	Named or hex colours become literal fill values you can find and replace.
Stroke	no outline, 2px uniform stroke	Fixes stroke-width across the drawing instead of leaving it per-shape.
Background	transparent background	Say it, or you may get a filled rect behind everything.
Composition	centred, square, even margin	Keeps the artwork inside the viewBox with room to breathe.

Fidelity

Two models, and the honest case for each.

Standard

1 credit

The everyday tier. Icons, spot illustrations, badges, marks — anything where the shape language is simple and the palette is small.

Premium

2 credits

The higher-fidelity vector model. Worth it for detailed illustration, layered scenes, subtle gradients and anything you intend to print large.

Credits are only spent on generation. Editing, optimising and exporting an existing file cost nothing.

What lands in the file

Readable enough to review in a pull request.

Named groups

Paths arrive under IDs like #ears or #shading, so the Figma layer panel is legible the moment you drop the file in.

Trimmed precision

Coordinates carry the decimals the curve needs and no more. Diffs stay small when you re-export.

Real gradients

Linear and radial gradients are written as defs you can retune, not baked into a raster fill.

Component-ready

Copy it out as a React component, with the JSX attribute names already converted.

The other job

Converting your own type to SVG paths.

If you came here with words rather than a description — a wordmark, a name, a quote to cut in vinyl — this is the four-step version. It costs no credits.

01
Set the type
Text tool, then size and letterspace it on the canvas. It stays live at this stage, so keep adjusting until the spacing is right — that is much harder once it is geometry.
02
Flatten to outlines
Convert the text element to paths. The font reference disappears from the file and each letterform becomes a closed shape, which is why the result renders identically on a machine that has never had your typeface.
03
Check the counters
The holes in a, e, o and g are separate subpaths held in place by fill rules. Confirm they survived before you send the file anywhere — a cutter that loses them cuts the middles out of your letters.
04
Export for its destination
A cut file wants one path per colour and no stray shapes. A logo wants tidy groups and your exact brand hex. Both want the width and height dropped so the viewBox does the scaling.

The reason to outline is always the same: a <text> element is a reference to a font that has to exist on the other machine. Outlines are the letters themselves. Cutting software, print shops and anyone you email the file to all need the second thing.

Questions

Text to SVG, answered.

How do I convert text to SVG paths?: Set the type with the text tool in the editor, then flatten it to outlines. The letters stop being a font reference and become closed geometry — which is what you want the moment the file leaves your machine, because the recipient almost certainly does not have your font installed.
What is the difference between SVG text and SVG paths?: A <text> element keeps the letters live: still editable, still searchable, still selectable — and still dependent on the font being available wherever it renders. Outlined text is the same letters converted to path data: no longer editable as words, but guaranteed to look identical everywhere. Live for a web page you control, outlined for anything you hand to someone else.
Does this actually write SVG, or does it trace a generated image?: It writes vector output directly. There is no PNG in the middle to trace, which is why the file comes back with closed shapes and smooth bezier handles rather than the thousands of jagged points a tracer produces.
Can I use my own font?: Yes, provided its licence allows it. Once you flatten the type to outlines the font file itself is no longer part of the SVG — but embedding or outlining a typeface is still a licensing question, and a few foundries restrict exactly this. Check the EULA before you outline a commercial face for a product you sell.
Can I make curved text as SVG?: Yes, two ways. Live text can follow a path with a <textPath> element referencing any path in the file, which stays editable. Or draw the curve, run the type along it, then outline the result — which is what you need if the file is going to a cutter or to anyone without your font.
Why does Cricut or my laser cutter need text converted to outlines?: Cutting software cuts paths, not typography. A <text> element gives it nothing to follow, so the letters either vanish on import or come in as a box. Outline the type first and each letterform becomes a closed shape the machine can trace — which is also why counters, the holes in a and o, need checking before you send it.
Can ChatGPT make an SVG file?: It can emit SVG markup, and for a handful of primitives that works. What it does not do reliably is produce coherent multi-shape artwork — the paths tend to be plausible-looking coordinates that do not close, overlap correctly or align. The output here is built to be geometry rather than text that resembles geometry, which is why it opens in an editor with anchors you can actually drag.
How long is a good prompt?: Two to three sentences. Name the subject, the style, the palette and the background. Your prompt is expanded automatically before generation, so you are giving direction rather than writing the full spec yourself.
Is it free?: A free account gets a credit on sign-up with no card. Generation spends credits; setting type, outlining it, editing and exporting do not.
Can I edit the result?: Yes. Every generation opens in the editor, where you can drag anchor points, move bezier handles, recolour fills, rename layers and delete shapes you do not want.
What size is the output?: Generation runs at 1024 x 1024 by default. Because the result is vector, that number is only the coordinate space — the graphic renders sharp at any size, from a 16px favicon to a billboard.
Do I own what I generate?: Yes — royalty-free, worldwide, commercial use included, with no attribution required. See the licence page for the full text.

Your first prompt is free.

One credit, no card, and the path data on screen before you decide whether it is any good.

Start generating

Text to SVG: type a sentence, or outline your type.

Which kind of text to SVG did you mean?

A prompt into artwork

Type into outlines

The <text> element