Pixelated cursor trail

An interactive image pixelation cursor trail effect. Moving the cursor clears or pixelates the image, smoothly fading out the trail as you move. Clicking expands a ripple ring that pixelates or clears outward from the click point.

How It Works

On load, the image is broken into a grid of colored blocks. As the cursor moves, every block under it gets drawn as a flat pixel square. When the cursor moves away, those blocks remember when they were last touched and gradually fade out.

The two modes share identical logic, one draws pixel blocks on top of a clean image, the other draws clean patches on top of a pixelated image.