A 3x3 grid reveal animation for images. When the image scrolls into view, it appears through nine staggered tile segments that expand outward from a center point, creating a layered, cinematic entrance instead of a simple fade or slide.
If you want to see how this component performs in a real layout, I've used it in my template Maria Vale, you can check it there.
Features:
Staggered 3x3 block reveal driven by scroll position
Adjustable animation duration and easing curve
Configurable stagger and group delay timing for full control over the reveal rhythm
Trigger amount control to decide how much of the image must be visible before it plays
Option to play once or replay every time it enters view
Fill, Fit, and Stretch image sizing modes with 9 position options
Optional alt text for screen reader accessibility
Automatic static fallback for the Framer canvas, exports, and reduced motion preferences
Use cases:
Portfolio and case study pages where images need a distinctive entrance
Hero sections and above-the-fold banners
Product or gallery grids where each image reveals as the user scrolls
Editorial and magazine style layouts that want a more editorial feel than a basic fade-in
Refund Policy: This is a digital product, so refunds aren't available once purchased. If you're unsure it's the right fit, email me or message me on X and I'm happy to help.
