Pixelate Tool
Pixelate an image by averaging each block, with retro palettes, ordered dithering and a true one-pixel-per-block sprite export. Runs in your browser.
🔒 This tool runs entirely in your browser. Your files are never uploaded to a server.
Do not use pixelation to hide anything. Averaging blocks is reversible in principle for small search spaces — pixelated numbers, licence plates and short text have all been recovered by rendering candidates and matching the blocks. If something must be unreadable, cover it with a solid shape and flatten the image. Everything here happens in your browser and nothing is uploaded.
How to use it
- Drop in an image — a drawn sample is loaded so the controls work immediately.
- Set the block size. The readout shows the resulting grid.
- Try a palette, and leave dithering on unless you want visible banding.
- Tick one-pixel-per-block for a real sprite, then download.
Averaging, not sampling
The one-line way to pixelate an image is to scale it down and back up with smoothing disabled. That keeps one pixel per block and discards everything else:
block of 10 × 10 = 100 pixels
sampling uses 1, ignores 99 noisy, drops thin detail
averaging uses all 100 stable, keeps the shape
The visible difference is worst on fine features. A one-pixel-wide line either lands on the sampled pixel and appears at full strength, or misses it and disappears completely — so as you drag the block size the line flickers in and out. Averaged, it fades smoothly as it should. The naive method is available as a toggle precisely so this is demonstrable rather than asserted.
Why dithering exists
Restricting an image to four or sixteen colours means most blocks are not any of them. Rounding each one to its nearest palette entry produces bands, because a whole swathe of a gradient rounds to the same colour and then abruptly switches:
nearest colour AAAAAAAABBBBBBBB a hard edge
dithered AABABABBABABBBBB reads as a blend
Ordered dithering adds a small offset from a repeating 4×4 matrix before rounding, so adjacent blocks tip to different sides of the boundary. It costs nothing, needs no error propagation, and produces the regular crosshatch texture that is characteristic of 1980s graphics — which for this purpose is a feature.
Pixelation is not redaction
This deserves saying plainly, because it is the most common reason people pixelate something and it does not work. A block average is a lossy but genuine description of the pixels underneath. If the hidden content comes from a small set — a six-digit number, a licence plate, a short word in a known font — an attacker can render every candidate, pixelate each one the same way, and compare. The match is usually unambiguous.
This has been done to real published documents more than once, which is why security guidance now says to remove the content rather than obscure it. If something must be unreadable: cover it with a solid opaque shape, flatten the image so there is no layer beneath, and check the exported file rather than the editing view. Use this tool for the aesthetic, not for secrecy.
Getting a real sprite out
A pixelated image at full resolution is a large file describing very little — a 480 × 320 image at block size 10 holds only 48 × 32 distinct values but is stored as 153,600 pixels. The one-pixel-per-block export writes the reduced grid at its own size instead, giving you the actual asset: a few hundred bytes, scalable with nearest-neighbour to whatever size you need, and directly usable as a game tile or an avatar.
FAQ
Can I use this to hide a face, a licence plate or a password?
No. Pixelation is not redaction. Block averages are a compressed description of what was there, and for anything drawn from a small set of possibilities — digits, plates, short words, a known font — the original can be recovered by rendering candidates and matching the blocks. This has been demonstrated repeatedly on real leaked documents. Cover it with a solid shape and flatten the image instead.
Why does this look better than the CSS pixelated trick?
Because each block here is the average of every pixel it covers, while scaling down with nearest-neighbour keeps one pixel per block and throws the rest away. Sampling is noisy and loses thin features entirely — a power line or a strand of hair either survives at full strength or vanishes. There is a switch to use the naive method so you can see the difference on your own image.
What does dithering do?
It stops a limited palette from banding. Mapping every block to its nearest palette colour turns a smooth gradient into hard stripes; ordered dithering nudges each block by its position in a repeating matrix first, so the boundary alternates between two palette colours and reads as a blend. It is what period hardware did, and it is why old game backgrounds have that checkerboard texture.
What is the difference between the export options?
By default you get an image the same size as the input, made of large blocks. With one-pixel-per-block you get the true sprite — a 480 by 320 image at block size 10 becomes 48 by 32 pixels. That is the version you want as an actual game asset or an avatar, and it is a few hundred bytes rather than a few hundred kilobytes.
Why does the palette matching look weighted?
Because an unweighted colour distance picks visibly wrong entries. Green contributes far more to perceived brightness than blue, so the nearest colour is found with green weighted heaviest — otherwise a mid-green maps to a palette blue that is numerically close and looks nothing like it.
Is my image uploaded?
No. Reading, pixelating and exporting all happen in the page. Nothing is sent anywhere — which given the first answer above is worth knowing, since people do reach for this tool with sensitive images.
How we compare
| Feature | Online Tool Store | Other pixelate tools | Aseprite or Photoshop |
|---|---|---|---|
| Averages each block rather than sampling | ✓ | Usually samples | ✓ |
| Retro palettes with ordered dithering | ✓ | ✗ | ✓ |
| Exports at true sprite size | ✓ | ✗ | ✓ |
| Warns that pixelation is not redaction | ✓ | ✗ | ✗ |
| Nothing uploaded | ✓ | Varies | ✓ |
| Pixelate only a selected region | ✗ | ✓ | ✓ |
| Hand-editing individual pixels afterwards | ✗ | ✗ | ✓ |
Better output than the usual approach because it averages rather than samples, and it exports a genuine sprite rather than a big picture of squares. It works on the whole image at once and cannot touch individual pixels afterwards — a dedicated pixel editor is where that work belongs.