Image to SVG converter
Choose a logo, icon or drawing with large areas of flat colour. The tool reduces it to a small palette and traces the outline of each colour into SVG paths that scale without blur. It is made for flat images; a photo will give a large, messy file.
Runs in your browser: nothing you enter is sent anywhere.
How to use it
- Choose or drop a logo or flat drawing.
- Set the Number of colours to match the artwork.
- Pick a Tracing size: larger keeps more detail but makes a bigger file.
- Raise Smoothing to simplify jagged edges and Ignore shapes smaller than to drop specks.
- Check the preview and download the SVG.
How it works
The picture is scaled down and its colours are reduced with a median cut on the list of distinct colours, so a small accent colour is not lost next to a large background. Each colour becomes a mask of pixels. The boundary between masked and unmasked pixels is followed into closed loops, which are simplified with the Douglas–Peucker method and written as one path per colour. The paths use the even-odd fill rule, so holes (the inside of an O) are cut out correctly.
Example
A white picture with a black 2 × 2 square gives two colours: a white background rectangle and one black path, M2 2 L4 2 L4 4 L2 4 Z.
Tips
- Remove JPEG noise first if you can; it produces many tiny shapes. A PNG source traces much better.
- If the colours come out slightly different from the brand colours, open the SVG in a text editor and replace the fill values.
Frequently asked questions
What kind of pictures work?
Logos, icons, signs and drawings with few flat colours and clear edges. Photos, gradients and soft shadows have thousands of colours; reduced to a few they look posterised, and the SVG gets very large.
Is the result smooth curves?
No. The outlines are made of straight segments. Smoothing removes the staircase of the pixel grid by replacing nearly straight runs with one segment, so edges stay clean, but curves are drawn as many short lines, not Bézier curves. Use a larger tracing size for rounder shapes.
Why is the tracing size limited?
Tracing is done in your browser, so the picture is reduced to at most 100–400 pixels on the long side first. The SVG keeps the original proportions and width and height, and scales to any size.
What do colours and ignored shapes do?
The palette is cut to the number of colours you choose (2 to 32). The most common colour becomes a background rectangle, the others are traced on top. Shapes smaller than the chosen area are dropped, which removes specks and anti-aliasing fringes. Transparent areas stay transparent.