What this generates
This page generates a genuinely pixelated image, computed by downscaling then upscaling with sharp edges. The image is drawn onto a tiny canvas (width divided by your block size), then that tiny canvas is drawn back up to full size with image smoothing turned off, producing real blocky pixelation -- not a blur.
Change the fields above and the output updates live.
Related tools
See the Canvas Duotone Image Effect Tool for a related effect.
Frequently Asked Questions (FAQ)
What does this tool actually produce?
It generates a genuinely pixelated image, computed by downscaling then upscaling with sharp edges. The image is drawn onto a tiny canvas (width divided by your block size), then that tiny canvas is drawn back up to full size with image smoothing turned off, producing real blocky pixelation -- not a blur.
Is my image uploaded anywhere?
No. Everything runs in your browser -- whether that is a CSS snippet built from your inputs, or real pixel processing on a canvas for an uploaded photo. Nothing is sent to a server.
Can I use the output directly?
Yes. Copy the CSS/HTML snippet into your project, or save the resulting image if this tool processes an uploaded photo.
