A free, in-browser Image Trace — no Adobe subscription required
Image Trace is the feature, popularized by Adobe Illustrator, that converts a
raster image — a grid of pixels, like a PNG or JPG — into vector artwork made of editable paths.
It is the thing you reach for when you have a logo that only exists as a flat image and you need a
crisp, scalable version: feed it the pixels, get back shapes. This page does that same core job for
free, entirely in your browser. There is no Creative Cloud login, nothing to download, and your
file never leaves your machine.
If you have searched for image trace and landed in Adobe's marketing, you have probably
also noticed the price tag attached. The honest framing is this: Illustrator's Image Trace is
genuinely excellent and more powerful than any free web tool for hard, near-photographic jobs. But
most people typing “image trace” do not have a hard job — they have a logo, an icon, a sticker, or
a piece of line art, and they want a clean vector now. For that, an online free image
trace that runs on your own device is faster, private, and costs nothing. That is exactly
what Vectorizely is.
The output is the part that matters: real SVG <path> geometry,
not your original bitmap hidden inside an SVG wrapper. It scales from a 16-pixel favicon to a
billboard without softening, it is editable node-by-node in any vector editor, and it usually
weighs a fraction of the PNG you started with.
How to image trace online, step by step
The whole point of a web tool is that the Illustrator workflow — place, open the Image Trace panel,
choose a preset, adjust thresholds, expand, clean up — collapses into a few sliders and an instant
preview. Here is the full motion:
- Add the image you want to trace. Drag a PNG or JPG onto the tool above, or click to browse. It is read locally — nothing is uploaded. (Try the built-in logo, icon, and illustration samples to see how each kind of art traces.)
- Set the colors. The Colors slider decides how many distinct colors the vector keeps. This is the rough equivalent of choosing a Black-and-White, limited-color, or full-color trace in Illustrator. Two to four colors for a flat logo; more for a detailed illustration.
- Tune despeckle and smoothing. Open the advanced controls. Despeckle drops the tiny stray paths anti-aliasing leaves behind (Illustrator's Noise); Smoothing sets how tightly curves follow the edges (its Paths and Corners). Watch the live preview as you drag.
- Download the traced vector. Click Download SVG. There is no “Expand” step to remember — what you preview is the editable vector you get. Open it in Illustrator, Inkscape, Figma, or drop it straight into a website.
What “Image Trace” actually means
It is worth being precise, because the name suggests something it is not. Tracing does not
losslessly “convert” pixels into vectors — that information does not exist in the same form, so it
cannot simply be re-encoded. Instead, a tracer interprets the image: it reduces
the colors to a small palette, groups neighboring pixels of the same color into regions, and
approximates the jagged boundary of each region with smooth curves. The result is a genuine vector,
but it is a reconstruction of your raster, not a pixel-perfect copy.
This is the key mental model, and it is the same whether you trace in Adobe Illustrator, Inkscape,
Photoshop, or here. For flat, hard-edged artwork the reconstruction is essentially
indistinguishable from the original and scales forever. For a photograph it is a rough
approximation that looks posterized. Everything good and bad about image tracing flows from that
one fact — which is why the kind of image you feed it matters far more than which tool you use.
Image Trace in Illustrator vs. this free tool — an honest comparison
Let us be fair to Adobe. Illustrator's Image Trace is a mature, deeply configurable engine, and for
the hardest jobs it is better than any free web tracer, full stop. The point of this comparison is
not to claim otherwise — it is to map Illustrator's controls onto ours so you know exactly what you
are getting and what you are giving up.
| Illustrator Image Trace | What it does | Equivalent here |
| Preset (e.g. 3 Colors, 6 Colors, High Fidelity Photo) | A bundle of settings tuned for a type of art | Set the Colors slider — low for flat art, high for detailed |
| Mode (Color / Grayscale / Black & White) | Whether the trace keeps color, tone, or pure shapes | Colors = 2 approximates Black & White; raise it for color |
| Colors / Threshold | How many colors, or the cut-off for B&W | The Colors slider (quantization palette size) |
| Paths | How tightly paths fit the pixel edges | Smoothing (lower = tighter fit) |
| Corners | How sharp corners are kept vs. rounded | Smoothing (lower preserves hard corners) |
| Noise | Ignores areas below a pixel-count threshold | Despeckle (drops tiny stray paths) |
| Expand | Converts the live trace into final editable paths | Not needed — the preview is the editable SVG; just download |
What you give up by leaving Illustrator: its method options (abutting vs. overlapping paths),
per-trace fills-vs-strokes control, ignore-white toggles, and the ability to keep editing the trace
parametrically before expanding. What you gain: it is free, it opens instantly in a browser tab, it
never uploads your file, and there is no software to install or keep updated. For a designer who
already pays for Adobe and is mid-project, staying in Illustrator is the right call. For everyone
else — and for quick one-off traces even if you do own Illustrator — the web tool is the
shorter path.
Image Trace alternatives: Inkscape, Photoshop, and paid engines
Illustrator is not the only place to trace, and a fair page should say where each option shines.
Inkscape — “Trace Bitmap”
Inkscape is free, open-source, and offline, and its Trace Bitmap dialog (Path →
Trace Bitmap) is the closest desktop analogue to Illustrator's Image Trace. It offers single-scan
modes (brightness cutoff, edge detection, color quantization) and multi-scan modes that build up a
full-color trace in stacked layers — genuinely powerful, with potrace under the hood. The trade-off
is a desktop install and a notably steeper, more technical interface; the dialog throws a lot of
knobs at you with little hand-holding. If you want maximum control for free and do not mind the
learning curve, Inkscape is excellent. If you want a clean trace in three sliders without installing
anything, this tool is faster.
Photoshop
Photoshop is a raster editor, so it has no true Image Trace. People approximate it with the
Pen tool (manual, slow, but precise), or by converting a selection to a Work Path and exporting via
Shape layers — workable for a simple silhouette, painful for anything detailed. If your subscription
is to Photoshop rather than Illustrator, a dedicated tracer (this one, or Illustrator if you have it)
will be much quicker and produce cleaner paths than hand-pathing in Photoshop.
Paid web engines (vectorizer.ai, Vector Magic)
For the genuinely hard cases — complex color, soft edges, near-photographic input — dedicated paid
engines can beat any free tracer on raw edge quality. They are worth it when the image truly demands
it. The trade-offs are real, though: they are paywalled or watermarked, and they upload your file to
their servers to process it. For confidential artwork, or for the everyday logo-and-icon job, those
costs are not worth paying.
| Tool | Cost | Runs | Best for | Trade-off |
| Vectorizely (this tool) | Free | In your browser | Logos, icons, flat art — fast & private | Not built for photographic tracing |
| Illustrator Image Trace | Subscription | Desktop app | Designers in Adobe; fine manual control | Costs money; another app to open |
| Inkscape Trace Bitmap | Free | Desktop app | Power users who want every knob, offline | Install; steeper learning curve |
| Photoshop (Pen / Work Path) | Subscription | Desktop app | Hand-tracing a simple silhouette | No real auto-trace; slow & manual |
| vectorizer.ai / Vector Magic | Paid | Their servers | The hardest, near-photographic images | Watermarked / paywalled; uploads your file |
When image tracing works — and when it doesn't
Trace quality is almost entirely a function of the kind of image, not the tool. The same
rule applies to Illustrator, Inkscape, and this page alike:
| Image type | Traced result | Recommended? |
| Logo / wordmark | Crisp, a handful of clean paths, tiny file | ✅ Ideal |
| Icon / pictogram | Sharp, editable, scales to any size | ✅ Ideal |
| Line art / inked sketch | Clean outlines; raise smoothing for flowing lines | ✅ Great |
| Flat / vector-style illustration | Good with enough colors; slightly stylized | ✅ Good |
| Screenshot / UI mock-up | Shapes trace fine; small text edges get rough | ⚠️ Mixed |
| Photograph | Posterized blobs, large messy file | ❌ Keep as raster |
| Gradient / soft shading | Visible banding into flat steps | ❌ Keep as raster |
The test: could you redraw the image with a limited set of solid colors and clean edges? If yes, it
traces beautifully. If it depends on smooth tonal transitions — skin, sky, photographic texture — it
will not, and the honest move is to keep the original raster. We would rather tell you that than
hand you a five-megabyte SVG that looks worse than the PNG you started with. This is not a
limitation of our tracer specifically; it is the nature of tracing, and Illustrator will
posterize the same photo just as readily.
How image tracing works under the hood
Every image tracer — Adobe's included — runs essentially the same three-stage pipeline, and each
stage maps directly onto a control in the tool above:
- Color quantization. The image's thousands of slightly different pixel colors are reduced to a small palette of N representative colors. That is the Colors slider (Illustrator's Colors/Threshold). A clean two-color logo wants a low number; a richer illustration needs more.
- Region segmentation. Adjacent pixels sharing a quantized color are grouped into contiguous regions. Tiny stray regions — usually the fuzzy halo anti-aliasing leaves at edges — are discarded according to the Despeckle threshold (Illustrator's Noise).
- Curve fitting. The jagged, stair-stepped pixel boundary of each region is approximated with smooth Bézier curves. How tightly the curve hugs the original edge versus how much it relaxes into a flowing line is the Smoothing control (Illustrator's Paths and Corners).
Understanding the pipeline makes the failure modes obvious. A photograph has effectively unlimited
colors and no clean region boundaries, so quantization discards most of the information and
segmentation produces a chaos of little blobs — hence the posterized look. Flat artwork, by
contrast, already is a small set of solid-color regions with crisp edges, so every stage
has an easy job and the trace comes out clean. The same logic explains why starting from a
higher-resolution source helps: the curve-fitter has more, cleaner edge pixels to work from.
Getting a clean trace: tuning the three controls
Three sliders do almost all the work. Start with the defaults, preview, then reach for these only
if the result needs it:
- Colors — the size of the quantized palette. Drop it to 2–4 for a flat logo so you get a few crisp shapes; raise it for illustrations that genuinely need more tones. Too many colors on a simple logo just scatters stray specks into the output.
- Despeckle — removes tiny stray paths from anti-aliasing or JPEG noise around edges. Nudge it up if your trace looks like confetti; keep it low if you are losing real small details or thin lines.
- Smoothing — how aggressively edges are fitted to curves. Higher smoothing gives flowing, organic outlines (good for hand-drawn art); lower smoothing keeps hard corners (good for geometric logos and UI shapes).
A practical workflow: get the shape count right with Colors first, then clean up noise with
Despeckle, and only then adjust Smoothing for the corner feel. Chasing Smoothing before you have the
palette right just hides the real problem. And if the source PNG is small or fuzzy, the cleanest
result almost always comes from tracing the highest-resolution version you have — a 1000-pixel logo
gives the curve-fitter far more to work with than a 200-pixel thumbnail.
A real vector vs. a bitmap hidden inside an SVG
This is the most common trap with “free” converters, and it is worth understanding before you trust
any of them. An SVG file is allowed to embed a bitmap — you can wrap a PNG in an
<image> tag, save it with an .svg extension, and technically hand
over “an SVG.” But it is a counterfeit vector: it does not scale, it cannot be edited path-by-path,
and the file is often larger than the PNG inside it. Plenty of tools do exactly this because
it is instant and always “succeeds.”
A genuine image trace produces real <path> geometry, and you can verify it in
seconds. Zoom the output preview far in: a true trace stays razor-sharp at any magnification, while
an embedded bitmap pixelates exactly like the original. The path count shown beneath the tool is
another tell — a real trace reports tens or hundreds of paths; an embedded PNG reports zero.
Vectorizely always traces real geometry.
Expanding and cleaning up the traced result
A traced SVG is production-ready, but a quick cleanup pass often makes it smaller and tidier —
the equivalent of the tidy-up you would do after expanding an Illustrator trace.
- Run it through SVGO. SVGO (and its web front-end SVGOMG) strips editor metadata, collapses redundant groups, and rounds coordinates to a sensible precision — frequently halving file size with no visible change.
- Merge or delete paths. In a vector editor, combine several paths that share a fill color, or delete a stray speck the despeckle pass missed. This is the same “select similar / clean up” step you would do post-Expand in Illustrator.
- Edit nodes for precision. Open the SVG in Illustrator, Inkscape, Figma, or Affinity and nudge anchor points by hand where a curve needs to be perfect — a traced corner is a starting point, not a contract.
- Recolor to exact brand values. Quantization snaps colors to a palette, so set precise hex values afterward; because it is an SVG, you can do this in a code editor or with CSS.
For most logos none of this is strictly necessary — the trace is already a few kilobytes of clean
paths. For detailed artwork it is worth a pass before you ship.
Using your traced vector: web, code, design tools, and cutting machines
Once you have the SVG, here is where it actually goes:
- On a website (HTML/CSS). Drop it in with
<img src="logo.svg">, or paste the SVG markup inline so you can recolor it in CSS — set fill: currentColor and the icon inherits your text color. Inline SVGs are also animatable and styleable per-state (hover, dark mode). - As a React/framework component. Most bundlers import SVGs directly; tools like SVGR turn one into a React or Preact component so you can pass props like
size and color and tree-shake unused icons. - In design tools. Open or place it in Figma, Illustrator, Inkscape, Affinity Designer, or Sketch as fully editable shapes — the trace becomes your starting layer.
- For Cricut, Silhouette, and laser cutters. Cutting and engraving software needs clean vector paths to follow as cut or score lines. Upload the traced SVG to Cricut Design Space, Silhouette Studio, Glowforge, or LightBurn, and the machine follows the geometry. This is one of the most common reasons people trace a logo in the first place.
- For print and signage. A vector scales to posters, banners, vehicle wraps, and business cards without pixelation, so the same traced file serves a favicon and a billboard.
What's actually inside the SVG file
Unlike a PNG, an SVG is not an opaque binary — it is plain text (XML) you can open in any code
editor and read. A traced logo might be a short list of <path> elements, each
with a d attribute describing move, line, and curve commands, plus a fill
color. Wrapping them is an <svg> tag with a viewBox — the coordinate
system that lets the whole thing scale to any pixel size without redrawing. Because it is text, an
SVG diffs cleanly in version control, compresses extremely well with gzip or brotli, and can be
recolored or animated with nothing but CSS. That transparency is a big part of why vectors are the
right format for anything meant to last and adapt across contexts.
For designers reconsidering Adobe over subscription cost — an honest take
A lot of people searching “image trace” are quietly asking a bigger question: do I still need to pay
for Illustrator? The fair answer is, it depends on the rest of your work. Image Trace is one
feature of a deep, professional application; if you live in Illustrator all day — type on a path,
complex gradients, precise pen work, brushes, print production — its tracing is just a bonus and
leaving would cost you far more than it saves. Do not switch tools over a single feature.
But if tracing is most of why you keep opening Illustrator, the math changes. A free in-browser
tracer covers the common logo/icon/line-art cases; Inkscape covers the power-user cases for free
offline; and a paid per-image engine handles the rare near-photographic job for a few dollars when
it actually comes up. That stack costs nothing most months and still leaves the hard jobs covered.
We are not going to pretend a slider beats a professional vector suite at everything — it does not —
but for the specific job of turning a raster into clean vector paths, you very likely do not need a
monthly subscription. Use the tool that fits the work, not the brand.
Make your traced SVG accessible
A vector that conveys meaning should be readable by assistive technology, the same as any image. For
an inline SVG, add a <title> (and optionally a <desc>) as the
first child and reference it, or put role="img" with an aria-label on the
<svg> element. Purely decorative marks should be hidden from screen readers with
aria-hidden="true". And because some users override colors or are colorblind, never rely
on color alone to carry meaning — shape and label should stand on their own. Traced icons used as
buttons also need an accessible name, so do not ship a bare clickable path with no label.
Why this image trace runs in your browser
Most online tracers upload your file, process it on their servers, and send the result back — which
means your unreleased logo or a client's brand asset briefly lives on someone else's machine, under
their retention policy. Vectorizely traces locally with in-browser code, so the image never leaves
your device. It works offline once loaded, there is no upload wait, and confidential artwork stays
confidential — the same privacy you get from a desktop app like Illustrator or Inkscape, but with
nothing to install.
Running in the browser is also why the tool can stay genuinely free. There is no per-trace server
cost to recover, so there is no paywall, no watermark stamped across your download, and no “sign up
to continue.” You get real vector paths, instantly, on your own machine — which is all most people
ever wanted from Image Trace in the first place.
Frequently asked questions
What is Image Trace?
Image Trace is the feature, popularized by Adobe Illustrator, that converts a raster image (a grid of pixels like a PNG or JPG) into vector artwork made of editable paths. Photoshop, Inkscape (where it is called Trace Bitmap), and tools like this one all do the same core job. This page is a free, in-browser image trace that needs no Adobe subscription and no install.
Is this a free Image Trace alternative to Illustrator?
Yes. It performs the same fundamental operation as Illustrator’s Image Trace — quantize the colors, find the regions, fit curves to their edges — for free, with no account, no watermark, and no file limit. Illustrator remains more powerful for complex, near-photographic jobs and offers finer manual control; for the common case of a logo, icon, or piece of flat art, an online free image trace gets you the same usable vector in seconds.
How do I image trace in Illustrator versus here?
In Illustrator you place the image, open Window → Image Trace, pick a preset, expand the result, then clean it up. Here you drop the image, drag the Colors slider, and download the SVG — the preset/threshold/expand steps collapse into three sliders and an instant preview. You lose Illustrator’s deep manual editing, and you gain speed, privacy, and zero cost.
Will my image be uploaded to a server?
No. The image is read and traced entirely on your device using in-browser code; it never leaves your computer. That makes it safe for confidential logos, unreleased brand work, and client files — the same privacy you get tracing a local file in a desktop app, but with nothing to install.
Does it produce real vector paths or a bitmap inside an SVG?
Real vector paths. The tool traces outlines and color regions into SVG <path> elements that scale to any size and stay editable. It does not wrap your original bitmap in an <image> tag and call it a vector, which is what many “free” converters quietly do. Zoom the output in: a real trace stays sharp; an embedded bitmap pixelates.
Why does my photo look posterized after tracing?
Because tracing approximates an image with a limited set of flat color regions. Photos have thousands of subtly different colors and no hard edges, so the result is a posterized, blocky approximation — this is true of Illustrator’s Image Trace too, not just this tool. Tracing is for logos, icons, line art, and flat illustration; for photographs, keep a raster format like PNG or JPG.
Can I edit the traced vector afterward?
Yes. The downloaded SVG is standard, editable vector geometry. Open it in Illustrator, Inkscape, Figma, or Affinity Designer to move nodes, recolor shapes, or delete stray paths, and run it through SVGO to shrink the file. Because it is plain XML text, you can even open and tweak it in a code editor.
What image formats can I trace?
Any common raster the browser can decode — PNG, JPG/JPEG, WebP, GIF, BMP. The output is always a single resolution-independent SVG, so whatever you trace becomes a vector that scales cleanly afterward.