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.
### Key Features
- 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.
### Customization Options
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.
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.
### Key Features
- 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.
### Customization Options
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.
Jirei
