Back to Blog
general

PNG to SVG: What Real Vectorization Means and When It Fails

Most PNG to SVG converters wrap your bitmap in an SVG container instead of tracing it into paths. Here's how to tell the difference, and how to get true vector tracing with potrace, Inkscape or vtracer.

Rumen AtanasovNovember 5, 20268 min read
A pixelated PNG logo passing through a tracing lens that turns it into smooth Bézier curves, beside a bitmap sealed in a glass box

You ran your logo through a png to svg converter, the download arrived as logo.svg, and Cricut Design Space still treats it like a flat image. Zoom in and the edges are just as soft as the original. The file extension changed; the pixels did not.

That is not a bug. SVG is a container format that can hold two completely different things: mathematical paths, or a base64-encoded bitmap sitting inside an <image> tag. Most free converters do the second one, because it is instant, lossless and always works. Real tracing is slower, lossy in a different way, and fails outright on some images.

This article shows you how to tell the two apart in ten seconds, when a wrapper is genuinely the right answer, and exactly how to run true vector tracing with potrace, Inkscape and vtracer — including the settings that matter for a logo versus a photo.

The two things people call "PNG to SVG"

Wrapping takes your PNG, encodes it, and drops it inside an SVG document. The result is a valid SVG file that any browser, design tool or CMS will display. Internally it looks like this:

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512">
  <image width="512" height="512"
    href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUg..."/>
</svg>

Tracing analyses the pixels, finds the boundaries between colour regions, and rewrites them as Bézier curves. The output has no bitmap data at all:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
  <path fill="#1b1b1b" d="M94 318c-14-42 2-91 38-118 44-33 110-28 148 12..."/>
</svg>

Only the second one scales infinitely, can be recoloured per shape, and can be read by a cutting machine as a cut line. A wrapped PNG at 512 px will blur at 4000 px exactly as the PNG would, and Cricut will offer to print-then-cut it rather than cut the outline.

How to check what you actually got

Open the .svg in any text editor — VS Code, Notepad, TextEdit. Then look for one of two strings:

  • <image and base64 → it is a wrapped bitmap. Not a vector in any useful sense.
  • <path d="M... or <polygon points="... → it is traced geometry. A real vector.

Two faster tells: file size and zoom. A traced logo is usually 4–60 KB of text; a wrapped 512×512 PNG is roughly 1.33× the original PNG size (base64 overhead), so a 180 KB PNG becomes about a 240 KB SVG. And if you open the SVG in a browser and zoom to 800%, traced edges stay razor sharp while a wrapped bitmap goes soft.

Diagram comparing the inside of a wrapped SVG containing a base64 image with a traced SVG containing path data
The same filename, two entirely different file contents — a text editor tells you which one you have in seconds.

When wrapping is the right answer

Wrapping gets a bad reputation it only half deserves. It is genuinely the correct output when:

  • A pipeline or CMS only accepts `.svg` and you need the artwork through it unchanged.
  • You are dealing with a photograph or screenshot — tracing those produces thousands of junk paths and a 6 MB file that renders slower than the PNG.
  • You need pixel-exact fidelity, including soft shadows, gradients and anti-aliased edges that tracing will flatten.
  • You want to place a raster inside a larger SVG scene alongside real vector elements.

If that is your case, the PNG to SVG converter on File Convert Online does exactly this job in the browser: it wraps the bitmap in an SVG container with the right width, height and viewBox, and it does not trace. That is a deliberate design choice, stated up front, so you never ship a "vector" that turns out to be a photo in disguise. If you need other raster targets along the way, the site's image converter hub handles the neighbouring formats.

If you need cut lines, scalable print artwork or per-shape colour editing, keep reading — you need a tracer.

True vector tracing, three ways

All three tools below are free. Pick by what your source image is.

Inkscape Trace Bitmap (best for most people)

Say you have shop-logo.png, 1200×1200, black mark on white, 180 KB.

  1. File → Import the PNG, choose Embed, click OK.
  2. Select it, then Path → Trace Bitmap (Shift+Alt+B).
  3. For a one-colour logo: pick Single scan → Brightness cutoff, threshold 0.45. Raise toward 0.60 if thin strokes vanish; lower toward 0.35 if the shape bloats.
  4. Tick Live Preview and watch the node count reported under the preview. A clean logo should land somewhere in the low hundreds of nodes, not thousands.
  5. For flat multi-colour art: switch to Multicolor → Colors and set Scans to the number of distinct colours you can actually count — 4 or 6, rarely more than 8. Tick Remove background.
  6. Click Apply, then drag the new object off the original and delete the imported PNG.
  7. Tidy with Path → Simplify (Ctrl+L) once — only once, it is destructive and will round your corners.
  8. Save As → Plain SVG. Inkscape SVG stores extra editor metadata some cutters choke on.

Result for a typical logo: a 12–40 KB file with a handful of paths you can select and recolour individually.

potrace (best for crisp black-and-white, scriptable)

potrace only reads bitmap formats, so convert first with ImageMagick. This is the fastest route for batches of silhouettes, stamps or line art.

# PNG -> PBM, with a brightness threshold
magick shop-logo.png -alpha remove -colorspace gray -threshold 55% shop-logo.pbm

# Trace to SVG
potrace shop-logo.pbm -s -o shop-logo.svg

# Smoother, fewer nodes (good for cutting)
potrace shop-logo.pbm -s --turdsize 5 --alphamax 1.0 --opttolerance 0.4 -o shop-logo.svg

The three knobs worth knowing: --threshold on the ImageMagick side decides what counts as ink; --turdsize discards specks smaller than N pixels (raise it to 5–10 to kill JPEG-ish noise); --opttolerance trades node count for accuracy. potrace is monochrome only — colour art needs the next tool.

vtracer (best for flat colour illustrations)

vtracer --input sticker-art.png --output sticker-art.svg \
  --colormode color --color_precision 6 \
  --filter_speckle 4 --mode spline

Lower --color_precision (try 4) to collapse near-identical shades into one shape and shrink the file; raise --filter_speckle to 8 if anti-aliasing leaves confetti around the edges. --mode polygon gives you straight segments, which some cutters prefer.

Logo versus photo: why one works and one doesn't

Tracing finds edges between flat regions. A logo is almost nothing but flat regions, so the tracer produces a few clean paths that match what a human would draw.

A photograph has no flat regions. Every pixel differs slightly from its neighbour, so the tracer invents a boundary everywhere. Trace a 2000×1500 portrait at 16 colours and you get thousands of overlapping blobs, a multi-megabyte file, and a posterised look that is worse than the original at every zoom level. The honest answer for photos is: keep the raster, and wrap it if the extension matters.

Images that trace well: solid-colour logos, monograms, silhouettes, hand-lettering scanned at 300 dpi or higher, icons, simple line drawings. Images that trace badly: photos, screenshots with text, anything with gradients, soft shadows, glow effects or heavy JPEG artefacts.

Two preparation habits that double your hit rate: start from the largest source you have (a 300 px PNG upscaled to 2000 px traces no better — the information is gone), and delete the background first if it is not already transparent or pure white.

Your 60-second decision path

  • Need a cut file for Cricut or Silhouette? Trace it. Inkscape Trace Bitmap, single scan, threshold ~0.45, save as Plain SVG.
  • Flat colour illustration for print? vtracer with --color_precision 6, or Inkscape Multicolor with scans set to your real colour count.
  • Black line art, many files? potrace in a shell loop with --turdsize 5.
  • Photo, screenshot or gradient art, and a tool that demands `.svg`? Wrap it — fast, lossless, honest about what it is.
  • Not sure what you were given? Open the file in a text editor and search for base64.

And whichever route you take, verify before you ship: zoom to 800% in a browser. Sharp means paths. Soft means pixels.

FAQ

Will a wrapped PNG-in-SVG work in Cricut Design Space? It will upload and display, but Design Space will treat it as an image for Print Then Cut, not as cut paths. For cut lines you need traced geometry.

Does tracing restore detail the PNG lost? No. Tracing re-describes the pixels you have as curves. A blurry 300 px source produces blurry, lumpy curves.

Why is my traced SVG bigger than the original PNG? Too many colour scans or too much speckle. Reduce the colour count, raise the speckle filter, and run Path → Simplify once.

Can I trace a PNG with a transparent background? Yes, and it usually helps — the alpha edge gives the tracer a clean boundary. In Inkscape, remove the background first or tick Remove background in Multicolor mode.

Is there a free raster to vector converter that runs online? Browser tracers exist, but quality varies widely and large files often time out. For anything you intend to sell or cut, Inkscape, potrace and vtracer are free, local and far more controllable.

What about SVG to PNG, the other direction? That is always clean — rasterising vectors at any resolution you like loses nothing except scalability.

Ready to Convert Your Files?

Try our free online file converter. No registration required.

Start Converting