Converting an Image to SVG: 9 Tips for Clean, Small Vector Files
How image tracing works, which images convert well, and the settings that turn a messy, oversized SVG into a clean file you can actually use.
By the ClearPix team · · 4 min read
Converting a PNG or JPG into an SVG sounds like a single click, and sometimes it is. Other times the result is a blotchy shape with thousands of tiny fragments and a file several megabytes in size. The difference almost always comes down to the source image and a few settings. Once you understand how tracing works, getting clean results becomes predictable.
How image tracing works
A raster image is a grid of pixels; an SVG describes shapes. Converting one to the other is called tracing or vectorizing, and our image to SVG converter does it in three stages:
- Colour reduction: the image is reduced to a limited palette, for example 6 colours. Every pixel is assigned to its nearest palette colour.
- Edge tracing: the boundary of each area of the same colour is followed around to form an outline.
- Curve fitting: smooth curves and straight lines are fitted to those outlines, so a jagged staircase of pixels becomes a clean curve.
Each resulting shape becomes a path in the SVG. Fewer, larger, cleaner shapes mean a better and smaller file.
Which images convert well
| Image type | Result |
|---|---|
| Flat logos, icons, clip art | Excellent: clean, small, editable |
| Cartoons, comics, line art | Very good with more colours |
| Scanned hand drawings and signatures | Good after cleaning up the scan |
| Photos | Stylised, poster-like artwork with large files |
| Soft gradients and shadows | Banding, because gradients become steps |
9 tips for better results
1. Start from the largest, cleanest source
Small images have jagged edges that the tracer has to guess around. If your logo is tiny, enlarge it 2x or 4x with the AI upscaler first, with denoise low, so the edges are smooth and well defined.
2. Prefer PNG over JPG as a source
JPG compression adds speckles and halos around edges, and the tracer dutifully turns each one into a tiny shape. If you only have a JPG, raise speck removal and use fewer colours.
3. Remove the background first
A busy background traced into hundreds of shapes is the most common cause of huge SVGs. Cut the subject out with the background remover before tracing.
4. Use the right preset
Start with Logo for flat graphics, Illustration for cartoons and drawings, and Photo only when you want an artistic posterised look. Presets set sensible combinations of the other controls.
5. Match the colour count to the image
Count the colours actually in your logo, including the background if you want to keep it, and set Colours to that number. Extra colours mostly capture the soft, blended pixels at edges and create thin slivers around every shape.
6. Raise speck removal
Remove specks discards shapes smaller than a set size. Increase it until stray dots disappear, but stop before small intended details, like the dot on an i, vanish too.
7. Adjust smoothness for the style
Higher smoothness gives rounder, more flowing curves, which suit most logos. Lower values keep sharp corners and fine detail, which suit technical drawings and pixel-precise icons.
8. Lower the detail for smaller files
The Detail (trace size) setting controls how large the image is when traced. Lower values produce fewer, simpler shapes and much smaller files. Higher values capture more detail but grow the file quickly.
9. Finish in a vector editor
Automatic tracing gets you most of the way. For a professional result, open the SVG in Inkscape, Figma or Illustrator to merge stray shapes, straighten lines and, most importantly, replace traced text with real text in the correct font.
How to tell if your SVG is good
- Zoom in to 800%: curves should be smooth, with no wobbly edges.
- Check the file size: most clean logo SVGs are under 50 KB.
- Look for thin white gaps between colour areas.
- Place it on a dark and a light background to spot leftover edge fragments.
When not to use SVG
For photographs, SVG is almost always the wrong format. The file will be much larger than a JPG or WebP and will not look like a photo. Use WebP or JPG for photos, and keep SVG for logos, icons, illustrations and diagrams. If you are not sure whether your logo should be traced or simply enlarged, read upscale or vectorize?.