SVG or PNG
The short answer: SVG if the destination accepts it, PNG if it does not. A part number diagram is nothing but lines and text, which is exactly where SVG's advantages land.
The difference
| SVG | PNG | |
|---|---|---|
| What it holds | A document describing where lines and letters go | A grid of dots |
| Scaling | Edges stay clean at any size | Gets pixelated past the resolution it was written at |
| Text | Stays text — selectable, searchable | Becomes picture |
| Size | Tens of KB for a diagram like this | Tens to hundreds of KB at 2400px wide |
| Rendered at the press's resolution | Printed at the resolution it was made at | |
| Acceptance | Sometimes refused | Goes almost anywhere |
When to choose SVG
Your own product pages, internal documents, artwork sent to a printer. It does not pixelate when enlarged, so it survives a reader pinch-zooming on a phone — which matters in a diagram full of characters as small as a part number's.
Because the letters stay letters, they are searchable once the diagram is in a PDF, and a screen reader can reach them. But do not expect a search engine to treat text inside an SVG as page content. Write the same information into the surrounding text rather than leaving it only in the picture.
When to choose PNG
When the destination will not take an SVG: marketplace listings, social posts, some content management systems, anything pasted into an email. The format can carry scripts, so plenty of places refuse the upload as a matter of policy — the SVGs this tool writes contain no script, but the receiving end judges by the extension, not the contents.
Rough guide to picking a width:
- Shown about 1200px wide on a web page → export at 2400px, so it stays sharp on a high-density display
- Pasted into a document → 1200–2400px; take the larger end if the diagram's text is small
- Printed → send the SVG if you can. For PNG, aim for printed width in mm ÷ 25.4 × 300
How to decide
Find out whether the destination accepts SVG
If it does, use SVG. That question comes first.
If it does not, use PNG
Pick the width from what it is for, using the guide above.
Export both anyway
From an SVG you can remake the PNG at any time. The reverse does not work. Always keep the SVG.
Keep the JSON too, while the work continues
Only the JSON lets you carry on editing when the part number grows another character. Keep just the picture and you start over.
Exporting from this tool
Under the preview are 「SVGを保存」, 「PNGを保存」 and 「JSONを保存」 — save as SVG, PNG and JSON. The PNG width is yours to choose: presets, or anything from 800 to 4000px. Both come from the same layout, so the two never disagree.
The SVG carries subsets of the fonts holding only the characters the diagram uses, so the letterforms do not change on a machine without those fonts installed. Embedding fonts in an SVG explains the details.