Pixel Reveal Hero

Pixel Reveal opens your page with a solid color that breaks apart, pixel by pixel, to reveal the image underneath. Give it the same image and each pixel passes through that image's real color first, so the photo "loads" from a mosaic into full resolution.

Once the reveal ends, a scatter of pixels stays behind, grouped on the side you choose so your headline stays clean. Hover pushes them away and they drift back on their own. A built-in overlay (color + opacity) fades in after the reveal to keep text readable.

Solid → mosaic → sharp reveal on load

Leftover pixels that react to the cursor

Built-in overlay with color, opacity and fade controls

"On Complete" event to chain your own animations

Respects reduced motion; pauses when off-screen

Renders solid from the first paint, so the image never flashes early

How to use

Put your image in a frame that fills the section (Fill → Image).

Drop Pixel Reveal on top, position absolute, 100% × 100%, below your text and buttons in the layer order.

Set Mosaico to the same image, and Foco X/Y to the same position as the image fill.

Pick Lado (where leftover pixels gather) and tune Densidad, Radio hover and the overlay.