Striped Carousel

The Striped Carousel replaces basic sliding animations with a sophisticated "falling curtain" transition that adds a premium, dynamic feel to your portfolio or landing page.

Elevate your Framer site with a completely custom, highly-performant photo gallery component. The Striped Carousel replaces basic sliding animations with a sophisticated "falling curtain" transition that adds a premium, dynamic feel to your portfolio or landing page. - Dynamic Transition: Images are sliced into perfectly aligned vertical stripes that fall away in a staggered sequence depending on navigation direction. - Hardware Accelerated: Built with advanced CSS `transform` and `borderRadius` mathematics to ensure subpixel perfection and flawless 120fps rendering, avoiding the lag of heavy `clip-path` calculations. - Responsive Layout: Works beautifully at any aspect ratio, with images automatically scaling via native `cover` logic. - Fast Navigation Support: Click through images as fast as you want—in-progress animations will seamlessly snap to completion to keep up with the user. Available directly in the Framer Property Panel: - Images: Add as many photos as you want via standard Framer image arrays. - Stripes: Control the exact number of slices (up to 20 for optimal performance). - Animation: Fine-tune the fall distance, total duration, and stagger gap. - Aesthetics: Configure border radius, width, color, and style. - Arrows: Fully style the navigation arrows (Size, Background, Color). - Overflow: Toggle whether the falling stripes are hidden by the component bounds or visibly fall outside of them.

Striped image reveal transition.