How to Convert PNG to SVG: The Complete Guide

A PNG is a grid of pixels. An SVG is a set of mathematical instructions for drawing shapes. Converting between them means asking software to look at pixels and infer the shapes that produced them — a process called tracing or vectorization. Done right, you get an infinitely scalable, recolorable, editable asset. Done wrong, you get a 2MB file of blobs.

This guide explains how tracing actually works, because once you understand the three stages every tracer goes through, every weird result you have ever gotten suddenly makes sense — and becomes fixable.

First, Check Whether You Should

Tracing works brilliantly on artwork that was born as a drawing: logos, icons, line art, flat illustrations, pixel art. It works badly on photographs, gradients, and textures — a photo "converted" to SVG is typically a massive file that looks worse than the original. The rule of thumb: if the image was originally made of shapes, vectorize it. If it was made of light hitting a camera sensor, keep it raster.

How Auto-Tracing Actually Works

Every tracer, from Illustrator's Image Trace to open-source Potrace, runs roughly the same three stages. First, color quantization: reducing the image to a small number of flat colors. Second, region detection: grouping connected pixels of the same color into areas. Third, path fitting: fitting bezier curves to the boundary of each region. Each stage has a failure mode, and recognizing them tells you what to fix:

• Blobby, melted edges — the curve-fitting tolerance is too loose. Tighten the threshold or use a higher-resolution source.
• Thousands of tiny paths — too many colors survived quantization, often from JPEG noise or texture. Reduce the color count or clean the source.
• Halo outlines around shapes — anti-aliased edge pixels got quantized into their own in-between color. Increase contrast or reduce colors.
• Staircase curves — the input resolution is too low for the tracer to infer a smooth curve. Find or upscale a larger source.

Step-by-Step: Getting a Clean Conversion

• 1. Start with the biggest, cleanest PNG you can find. Twice the resolution roughly doubles the tracer's information about each curve.
• 2. Remove the background first. A white background traces into a giant white rectangle behind your artwork.
• 3. Pick the right trace mode. Stroke-based line art needs centerline tracing; flat color art needs fill tracing; pixel art needs exact pixel-to-rect conversion. Using fill mode on line art gives you hollow "outlined outlines."
• 4. Limit the palette. If the artwork has 4 colors, trace with 4 colors — not the default 16.
• 5. Simplify after tracing. Run path simplification to remove redundant nodes while the shape stays visually identical.
• 6. Optimize on export. Round coordinates, merge same-color paths, strip metadata.

Tool Options Compared

For transparency: Icora's tracer runs four mode-specific algorithms — centerline tracing for line art, posterized tone separation for isometric/3D looks, exact pixel-to-rect conversion for pixel art, and color quantization (up to 64 colors) for flat fills — and processes batches in a Web Worker so the browser stays responsive. The reason we bundle a tracer with an editor is the next section.

After the Trace: Cleanup

Tracing gets you 80% of the way. The remaining 20% — deleting stray nodes, merging paths that share a fill, smoothing micro-jags, snapping points to the pixel grid — is what separates a professional asset from an obvious auto-trace. Budget a few minutes per icon for node-level cleanup, and your converted SVGs will be indistinguishable from hand-drawn vectors.