Image Trace — Free & Online

Trace any raster image into clean, editable vectors — a free, in-browser alternative to Adobe Illustrator’s Image Trace. No account, no subscription, no upload. Best for logos, icons, and flat artwork.

Try:

Higher keeps more detail but makes a bigger, slower file. Logos are crispest at 2–16.

Input · raster
Output · SVG (scalable)
Drop an image to vectorize it — instantly, on your device.

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:

  1. 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.)
  2. 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.
  3. 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.
  4. 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 TraceWhat it doesEquivalent here
Preset (e.g. 3 Colors, 6 Colors, High Fidelity Photo)A bundle of settings tuned for a type of artSet the Colors slider — low for flat art, high for detailed
Mode (Color / Grayscale / Black & White)Whether the trace keeps color, tone, or pure shapesColors = 2 approximates Black & White; raise it for color
Colors / ThresholdHow many colors, or the cut-off for B&WThe Colors slider (quantization palette size)
PathsHow tightly paths fit the pixel edgesSmoothing (lower = tighter fit)
CornersHow sharp corners are kept vs. roundedSmoothing (lower preserves hard corners)
NoiseIgnores areas below a pixel-count thresholdDespeckle (drops tiny stray paths)
ExpandConverts the live trace into final editable pathsNot 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.

ToolCostRunsBest forTrade-off
Vectorizely (this tool)FreeIn your browserLogos, icons, flat art — fast & privateNot built for photographic tracing
Illustrator Image TraceSubscriptionDesktop appDesigners in Adobe; fine manual controlCosts money; another app to open
Inkscape Trace BitmapFreeDesktop appPower users who want every knob, offlineInstall; steeper learning curve
Photoshop (Pen / Work Path)SubscriptionDesktop appHand-tracing a simple silhouetteNo real auto-trace; slow & manual
vectorizer.ai / Vector MagicPaidTheir serversThe hardest, near-photographic imagesWatermarked / 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 typeTraced resultRecommended?
Logo / wordmarkCrisp, a handful of clean paths, tiny file✅ Ideal
Icon / pictogramSharp, editable, scales to any size✅ Ideal
Line art / inked sketchClean outlines; raise smoothing for flowing lines✅ Great
Flat / vector-style illustrationGood with enough colors; slightly stylized✅ Good
Screenshot / UI mock-upShapes trace fine; small text edges get rough⚠️ Mixed
PhotographPosterized blobs, large messy file❌ Keep as raster
Gradient / soft shadingVisible 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:

  1. 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.
  2. 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).
  3. 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.