Pixel Art Converter

How to turn a photo into pixel art

1. Add an image. Drag a photo onto the box or click it to pick a file. Anything your browser can open works — JPEG, PNG, WebP, GIF.
2. Set the resolution. The slider sets how many pixels wide the result is, from 8 to 200. The height follows automatically, so the aspect ratio is preserved.
3. Trim the palette (optional). The “colours per channel” slider starts at off, keeping the full range of colours. Move it up and the label tells you exactly how many colours you are left with — 8, 27, 64, and so on.
4. Turn on the pixel grid if it helps. It draws a faint line along every pixel boundary, which makes judging the resolution much easier. It only appears at 4× output scale or more, and it is drawn into the canvas — so untick it before exporting unless you want it in the file.
5. Pick an output scale and download. 4×, 8× and 16× multiply every pixel into a solid block of that size. The download is always a PNG.

How the conversion works

There are two drawing steps, and the trick is that they use opposite settings.

First, your image is drawn into a tiny off-screen canvas — if the slider says 64, that canvas really is 64 pixels wide. This is done with image smoothing switched on, so the browser averages a whole block of source pixels into each destination pixel. A 2,000-pixel-wide photo squeezed to 64 pixels means roughly 31×31 source pixels averaged into every output pixel. That averaging is what makes the small version look like the photo instead of a random sample of it.

Then that tiny canvas is drawn back up to full size with image smoothing switched off, which makes the browser use nearest-neighbour sampling: each of those 64 pixels becomes a perfectly flat, hard-edged square. Nothing is blended.

Doing both steps with smoothing on is the classic mistake. Downscaling without averaging drops pixels at random, so thin features flicker in and out and the result looks noisy; upscaling with smoothing feathers away the edges you just created and leaves a soft blur rather than pixel art. Average on the way down, never interpolate on the way up. That is the whole recipe.

Colour quantisation and why it matters

A normal photo has 256 possible values for red, green and blue — about 16.7 million combinations. Set the slider to N and each channel is snapped to N evenly spaced levels, so the palette becomes N³ colours:

• 2 levels → 8 colours. Each channel is forced to 0 or 255: pure black, white, red, green, blue, cyan, magenta and yellow. Brutal and poster-like.
• 3 levels → 27 colours. Flat, graphic, comic-book shading.
• 4 levels → 64 colours. A good general-purpose retro look — recognisable skin tones, obvious banding in gradients.
• 6 levels → 216 colours. Essentially the old “web-safe” palette. Subtle.
• 8 levels → 512 colours. Barely different from the original on most photos.

This matters more than people expect, because the palette is what actually reads as “retro”, not the resolution. A 32-pixel-wide image with millions of colours still looks like a modern photo someone shrank. A 96-pixel-wide image restricted to 27 colours immediately reads as a game sprite from 1990, because old hardware was limited by memory, not by screen size. If your output looks chunky but somehow still modern, pull the colour slider down before touching the resolution.

One caveat: this is uniform quantisation, which treats every colour equally. It is fast and predictable, but a tool that picks the best N colours for your specific image (median cut, k-means and similar) holds onto skin tones and skies better.

Resolution: how chunky should it be?

Some numbers that work in practice:

• 16–32 px wide — icon and sprite territory. A face becomes a suggestion of a face. Great for logos, symbols and silhouettes; hopeless for anything that depends on detail.
• 32–64 px wide — a portrait stays recognisable while still looking unmistakably pixelated. The sweet spot for photos of people, and roughly where a character portrait sat on 16-bit consoles.
• 64–128 px wide — real detail survives: text on a sign, individual leaves, background objects. Stylised rather than blocky.
• 128–200 px wide — a soft stylisation more than pixel art. Useful for landscapes and busy scenes that fall apart at lower settings.

The slider controls width only, and the pixel count grows with the square of it. Halving the resolution from 64 to 32 does not remove half the pixels, it removes three quarters of them — which is why the step from 40 to 32 feels far more dramatic than 160 to 152. Move the slider in proportional steps, not fixed ones.

Content matters as much as the number. High contrast and bold shapes survive downscaling; fine texture, thin lines and busy backgrounds turn to mush, because the averaging step blends them into flat grey. If a photo is not working, crop in tighter rather than raising the resolution.

A note on real pixel art

It is worth being straight about what this tool does. Hand-drawn pixel art is a genuine craft, and an artist working at 32×32 places every pixel on purpose. They use dithering patterns to fake extra colours out of a tiny palette, anti-alias edges by hand one pixel at a time to control how a curve reads, build ramps of three or four shades that shift hue as they darken, and break the grid where a shape needs to look right rather than be geometrically correct.

A downscaled photo is a fast approximation of that look. It is a useful one — it gets you an avatar or a thumbnail in ten seconds — but it is not a substitute, and the difference usually shows: an averaged photo has muddy transition pixels and stray colours where an artist would have committed to a single shade. If you want the real thing, use this to explore a composition, then redraw it by hand in an editor such as Aseprite, Piskel or GIMP. Plenty of pixel artists work from photo reference; the drawing is still the part that matters.

Exporting and sharing

Export at 8× or 16× unless you have a reason not to. A 64-pixel-wide image is tiny on a modern display — icon-sized, and smaller still on a high-density phone screen. Worse, social platforms re-compress whatever you upload and treat small images badly, often upscaling them with their own smoothing, which is exactly the blurring the conversion set out to avoid. Handing them a large image made of big, flat, already-hard-edged blocks gives their processing far less room to ruin it. At 16×, a 64-pixel image exports at 1,024 pixels wide, which suits almost anywhere.

The download is a PNG, deliberately. PNG is lossless and compresses large areas of flat colour extremely well — precisely what pixel art is — so an upscaled export is often a smaller file than the original photo. JPEG is the opposite: built for smooth photographic gradients, it discards high-frequency detail and smears the hard block boundaries that define the image, leaving halos and colour fringing on every edge. Keep the PNG as your master copy.

Is my image uploaded?

No. The conversion runs entirely on your device using the HTML5 Canvas API. Your photo is read from your own disk, drawn to a canvas in the page and never sent anywhere — no server, nothing stored, and closing the tab discards everything. You can confirm it by disconnecting from the internet: the tool keeps working. Full details are in our Privacy Policy.

Frequently asked questions

Why does the preview look blurry when I zoom in with my browser?

The preview uses image-rendering: pixelated, so it should stay sharp. If it looks soft, it is usually page zoom landing on a non-integer scale factor, which makes some pixels a fraction wider than others. The downloaded file is unaffected — it always contains exact, hard-edged blocks.

Why does my image look wrong after I saved it as a JPEG?

JPEG works by throwing away sharp transitions, which is the one thing pixel art is made of, so you get halos and smearing along every block edge. This tool always exports PNG for that reason; if something downstream re-encodes it, that is where the damage happens.

Does it work on a phone or tablet?

Yes. The file picker opens your camera roll on iOS and Android and everything runs locally in the mobile browser. Large photos take a moment to decode, but the conversion itself is fast because it happens on a small canvas. Drag and drop is desktop only — tap the box instead.

Can I keep a transparent background?

Yes, if your source image already has one — transparency carries through both drawing steps and into the PNG. The tool will not remove a background for you, so cut it out first if you need one.

Why do the colours shift when I use a very small palette?

Each channel is snapped to its nearest level independently, so red can round up while green rounds down and the hue moves — skin tones drifting orange or pink at 2 or 3 levels is the usual example. Raising the count to 4 or 5 usually keeps the hue while retaining the banded look.

Want something else? Turn the same photo into text with our ASCII art generator, pull a palette out of an image with the colour palette extractor, or browse all our free browser tools.