Image to SVG Tracer - Convert Raster Images to Scalable Vectors
Transform PNG, JPG, GIF, and other raster images into clean, scalable SVG vector paths. Choose B&W mode for logos, signatures, and line art, or Color mode for posterized illustrations. Powered by Potrace WASM, this tracer runs 100% in your browser with no server uploads.
Trace images to vector SVG locally
Upload any raster image and convert it to scalable vector paths. The tracer analyzes shapes and curves, outputting clean SVG code you can edit in any vector graphics program or embed directly on the web.
- Runs entirely in your browser using Potrace WebAssembly
- No server uploads; your images stay on your device
- B&W mode with threshold control for logos and signatures
- Color mode with posterization for flat illustrations
- Fine-tune noise filtering, curve smoothing, and scale
Tip: tracing works best on clean, high-contrast images. For photos, use the scale-down factor and posterization to reduce complexity.
How to use the image tracer
- Drop an image or click to browse for a PNG, JPG, GIF, or BMP file.
- Choose B&W mode for logos/line art or Color mode for illustrations.
- For B&W: adjust the threshold slider until the preview looks right.
- For Color: set the number of posterize levels (fewer = simpler SVG).
- Fine-tune turd size, corner smoothing, and scale as needed.
- Click Trace to generate the SVG, then download it.
Common use cases:
- Vectorize a logo from a PNG or scanned image
- Convert hand-drawn sketches or signatures to SVG
- Create scalable icons from raster originals
- Posterize illustrations for stylized vector art
Understanding the tracing parameters
- Threshold (B&W) - Pixels darker than this value become black. Adjust to capture the right amount of detail.
- Turd size - Filters out small blobs. Higher values produce cleaner output but may lose fine details.
- Alphamax - Controls corner smoothing. 0 = sharp corners, 1.334 = smoothest curves.
- Turn policy - How the tracer resolves ambiguous corners. Minority (default) usually works best.
- Opticurve - Optimizes Bezier curves for smaller, cleaner paths.
- Posterize levels (Color) - Number of color layers extracted. More layers = more paths = larger SVG.
- Scale down - Reduces image size before tracing. Use this for photos to keep SVG manageable.
Best practices for clean SVG output
- Start with high-contrast source images whenever possible.
- For logos: use B&W mode and experiment with threshold until edges are crisp.
- For line art: keep turd size low (2-5) to preserve fine strokes.
- For illustrations: use Color mode with 4-8 posterize levels for flat color areas.
- For photos: scale down significantly and accept artistic stylization.
- If SVG is too large: increase turd size, reduce posterize levels, or scale down more.
- Enable opticurve and increase tolerance for simpler, smaller paths.
When to use raster vs vector tracing
Not every image benefits from tracing. Here is when each approach works best:
- Trace to SVG: Logos, icons, signatures, line art, flat illustrations, silhouettes, QR codes.
- Keep as raster: Photos, gradients, complex textures, images where pixel-level detail matters.
Tracing photos will produce stylized, posterized results. If you need photorealistic output, keep the original raster format and use the Image Converter tool instead.
Frequently asked questions
What is image tracing and when should I use it?
Image tracing (or vectorization) converts raster images like PNG or JPG into scalable vector graphics (SVG) made of paths. Use it when you need infinitely scalable graphics for logos, icons, or illustrations that won't blur at any size.
What is the difference between B&W and Color mode?
B&W mode converts your image to pure black and white using a threshold, then traces the shapes. It's ideal for logos, signatures, and line art. Color mode extracts multiple color layers (posterization) and traces each separately, creating layered SVGs for flat illustrations.
Why do my traced SVGs have so many paths or look noisy?
This usually happens with photos or images with gradients. Try increasing the 'turd size' to filter out small noise, use the scale-down factor to reduce detail, or reduce posterize levels in color mode. Tracing works best on clean, high-contrast images.
What does the 'turd size' parameter do?
Turd size filters out small isolated blobs (speckles) in the traced image. Higher values ignore more small shapes, resulting in cleaner output but potentially losing fine details. Start with 2-5 for logos and increase if you see noise.
How can I reduce the SVG file size?
Use the scale-down factor to trace a smaller version of the image. Increase turd size to remove noise. Enable opticurve with higher tolerance for simpler curves. In color mode, use fewer posterize levels. These all reduce path complexity.
Does this tracer work offline?
After the Potrace WASM module is downloaded and cached on first use, tracing runs entirely in your browser without network requests. Your images never leave your device.
More tools
Jump to another builder
Every tool runs in the browser - no logins, accounts, or uploads required.
Crypto Mining with Solar
Size miners, solar, and batteries together and see payback, cash flow, and energy balance.
Flight Calendar Invite
Turn any flight number into a calendar invite with auto route lookup and an .ics download.
Series & Movie Release Notifier
Search TVMaze and Wikidata to find season finales or movie premieres and export a calendar reminder without API keys.
Password Generator
Generate strong, policy-friendly passwords with secure randomness and one-click presets.
Dumb Talking Text
Turn any message into alternating-case mocking text without sending it anywhere.
Media Metadata Scrubber
Strip EXIF/GPS data, resize to social/web presets, and compress images before uploading.
Image Format Converter
Convert images to PNG, JPG, WebP, GIF, BMP, or TIFF directly in your browser (AVIF/HEIC need native codecs).
Background Remover
Remove image backgrounds with modern ONNX models running locally in your browser.
PDF Editor
Merge files, reorder or drop pages, extract ranges, rotate scans, add text boxes, and cover/remove text directly in your browser.
Video Converter
Browser-native video converter for MP4, WEBM, or GIF with CRF, FPS, and resolution controls.
Video Editor
Trim, split, and stitch videos with transcript-guided cuts in your browser.
Audio Converter
Convert audio to MP3, WAV, FLAC, or OGG entirely in your browser with bitrate, sample rate, channel, and loudness controls.
Live Camera ASCII
Stream your webcam and transform frames into ASCII art instantly without uploading video.
Professional Rate Calculator
Calculate optimal rates for your professional services based on experience, market position, and business costs.
Dogs Explorer
Compare breeds, stats, and visuals with an interactive explorer powered by the dogs dataset.
Twitter Advanced Search
Build X/Twitter queries with real-world operators beyond the built-in advanced search.
Twitter Advanced Search Guide
Learn how to use X/Twitter search operators effectively with syntax tips and examples.
Twitter Lists Finder
Search for Twitter lists on specific topics using advanced query operators.
Twitter Places Search
Find Twitter place IDs for location-based searches using the _within:_ operator.
Twitter Tweet Capture Guide
Capture tweets with Tampermonkey using a step-by-step walkthrough.
WordPress Plugins
WordPress plugins authored by me, including Debug White Screen of Death and Redirection Add-on Monitor.
ONG Digital Grants Assistant
Interactive tool to identify and apply for digital transformation grants for non-profits in Spain