TOOLS › PNG TO SVG
FREE · NO SIGN-UP · RUNS IN YOUR BROWSER

PNG to SVG Pixel Art Vectoriser

Turn a pixel art PNG into a crisp SVG. Every block of colour becomes a vector rectangle with hard edges, so the sprite scales to any size with no blur and the file stays small.

1 · YOUR PIXEL ART

DROP, PASTE OR BROWSE
PNG, WebP or GIF at native pixel size · up to 1 MP

2 · SETTINGS

Display scale
Sets the SVG's width and height attributes. The drawing itself stays at one unit per pixel, so it scales cleanly to any size.
Joins runs of the same colour into bigger blocks. Same picture, far fewer elements.
Upscaled or blurry pixel art gives a rect per screen pixel, not per art pixel. Run it through Fix pixel art first to recover the native grid.
Result appears here
NOTHING HERE YETDrop a pixel art PNG on the left. The SVG is built and rendered here straight away.

How it works

Drop in pixel art

A sprite, icon or tile at its native size. Transparency is kept, and semi-transparent pixels get a matching opacity in the SVG.

Blocks become rectangles

Runs of identical colour are merged left to right and then downward, so each flat area becomes one rectangle. Rectangles are grouped by colour and drawn with crisp edges, no anti-aliasing.

Download or copy

Save the .svg or copy the markup straight into a web page, a design tool or a cutting-plotter job. The picture is identical to the PNG at every size.

Why pixel art needs its own vectoriser

General-purpose tracers were built for logos and line art. They look for edges, fit curves through them and smooth out the noise. Feed one a sprite and the corners get rounded, thin lines swell or vanish, and every colour drifts a little as the tracer averages neighbouring pixels. The output looks like a soft painting of your sprite, not the sprite.

Pixel art is already a set of exact squares, so the right vector is the obvious one: a rectangle per square, snapped to a whole-number grid, with hard edges. The only question is file size, and that is what merging solves. A 64 × 64 sprite is 4,096 pixels but usually fewer than 500 blocks of colour once horizontal runs and matching rows are joined. Semi-transparent pixels keep their alpha as fill-opacity, transparent ones are skipped, and a colour group per fill keeps the markup readable. The scale chip only changes the width and height attributes; the viewBox stays at native pixel units so the SVG scales cleanly wherever you put it.

FAQ

Is the PNG to SVG converter free?

Yes. The conversion runs in your browser, so the image is never uploaded and there is no account or watermark. Convert as many as you like.

Why not use a normal image tracer for pixel art?

Tracers fit smooth curves through the pixels, which rounds off corners and blurs the exact colours. Pixel art is made of squares, so the right vector is one rectangle per block of colour with hard edges. That is what this tool emits, and the result matches the PNG pixel for pixel at any size.

What does Merge rectangles change?

With merging on, runs of the same colour are joined into wider and taller rectangles, so a 64 by 64 sprite typically needs a few hundred rects instead of four thousand. The picture is identical either way. Turn it off only if you want one element per pixel for editing.

Are transparent and semi-transparent pixels kept?

Fully transparent pixels are skipped, so the SVG has a transparent background unless you turn on the background fill. Pixels with partial alpha get a matching fill-opacity, so soft shadows and glows survive.

Where can I use the SVG?

Anywhere that takes vectors: websites and icons, print and merch, laser cutters and cutting plotters, and design tools where you want to scale a sprite to poster size with no blur. Game engines generally still want the PNG.

More free tools

In the app

Open SpriteLab to keep building with your sprites.