SwirlReveal
Scroll-driven circular image reveal with staggered rotation
About this Component
A scroll-driven gallery component that arranges 8 images in a circle and reveals them as the user scrolls. Each image flies in from the side, rotates into position, and fades in — staggered for a fluid, cinematic effect.
Works on all devices. Fully responsive using CSS vw units. Compatible with Framer Preview and published sites.
Features:
8 customizable image slots via property controls
Scroll-driven animation with sticky viewport pinning
Staggered entry with power1.out easing
Hub size, image offset, scroll height and stagger all adjustable
No external libraries — pure React + CSS
