Gallery 21 block design & features
The block centers a Swiper carousel configured with the coverflow effect inside a max-width container. The slider shows approximately 2.5 slides at once, with the centered slide at full depth and flanking slides receding via a coverflow modifier. Images render with rounded-3xl corners and a box shadow. Gradient overlays on the left and right edges fade the outermost slides to white, focusing attention on the center. A Framer Motion wrapper fades the carousel in with a short upward slide on mount.
Below the carousel, a centered heading and a round secondary Shadcn UI Button with a rotated arrow icon provide a call-to-action. Custom CSS removes the default Swiper 3D slide shadows, keeping the depth effect clean. The carousel loops and auto-advances every 1.5 seconds with grab-cursor enabled.
The style is cinematic and immersive, relying on the 3D depth stacking and edge vignettes to create a sense of looking through a view-finder. The absence of any text overlay on the slides keeps them purely photographic.