Image to SVG

Image to SVG redraws a picture as vector shapes. A PNG or JPG is a grid of pixels, so it turns blurry or blocky when you enlarge it. An SVG describes outlines and fills instead, so the same file is crisp on a business card, a website header or a shop sign. It is the step you need when a logo only exists as a small image, or a sketch needs to go to a cutting machine, embroidery software or a laser cutter.

The tracer is written for flat artwork. It picks the main colours, cleans away the soft blended pixels along every edge, follows each outline and fits it with smooth curves, keeping straight sides straight and corners sharp. Colours are stacked like layers, so neighbouring shapes never leave thin white gaps. A black-and-white mode handles line art, signatures and stamps.

Photos don’t turn into good vectors with any tracer: you get thousands of blobs. Use it for logos, icons, clip art, drawings and scans of ink. Everything happens in your own browser, so your artwork is never uploaded.

1. Tap “Choose an image”, drop one on the box, or paste it. PNG, JPG, WebP, HEIC and more all work.
2. Pick a starting point under “Start from” (Logo, Icon, Illustration, Line art or Signature), or choose Flat colours or Black & white yourself.
3. Adjust Colours, Detail and Smoothness. The SVG redraws on the right each time; zoom in to compare edges, or tick “Show outlines” to see every shape.
4. Tick “Remove the background” if you want the shapes on a see-through background.
5. Press “Download SVG”, or “Copy SVG code” to paste it straight into a web page or design app.

• Flat-colour mode with 2 to 24 colours, picked automatically from the picture.
• Black-and-white mode with an automatic or hand-set threshold, invert, and any shape colour.
• Cleans anti-aliased edges so outlines sit exactly where the original edge was.
• Smooth Bézier curves, true straight lines and crisp corners, with Detail and Smoothness controls.
• Stacked colour layers: no hairline gaps between neighbouring shapes.
• Optional background removal for a see-through SVG.
• Side-by-side preview with linked zoom and an outline view of every path.
• Compact output: rounded coordinates, relative path commands and one path per colour, with size and shape count shown.
• Works on HEIC, TIFF, WebP and other formats, and runs in a background worker.

• Start with as few colours as the design really has. Extra colours mostly add tiny slivers and file size.
• If small text or thin lines disappear, raise Detail. If edges look lumpy, raise Smoothness or lower Detail.
• For a scanned signature or sketch, use Black & white with a see-through background, then set the shape colour to match your ink.
• Use the biggest, sharpest copy of a logo you can find. A tiny, blurry JPG gives the tracer less to work with.
• Tap a colour chip under the preview to copy its hex code for your brand notes.