Each caption lives inside its own slide instead of floating on top of the carousel, so titles move with the image and only appear as that slide reaches the center. Day or index tags sit beside a thin divider line between slides, and a running counter tracks position.
Seamless infinite loop, no snap back at the ends
Horizontal or vertical flow, drag, wheel, and keyboard navigation
Titles anchored to each slide, six position options (behind, front, above, above front, below, below front), font linked to your project's text styles
Tag labels with divider lines, position and spacing controls
Autoplay with adjustable speed, interval, and seven easing curves
Optional liquid glass edge distortion, images only, so text always stays sharp
Supports images and video, mixed in the same carousel
Portfolio and case study strips
Product or lookbook carousels
Editorial "day by day" or "chapter by chapter" storytelling
Hero sections that need motion without a video file
Framer code component (React and TypeScript). Works in any Framer project.
Responsive: desktop, tablet, mobile.
No external libraries or assets required.
Looks best on a dark or high contrast background.
Drop the component onto any frame and resize it.
Replace the sample media with your own images or videos, titles, and tags.
Pick a direction, a title position, and an easing curve.
Turn on liquid glass if you want the edge warp, then tune strength and splay.
Each caption lives inside its own slide instead of floating on top of the carousel, so titles move with the image and only appear as that slide reaches the center. Day or index tags sit beside a thin divider line between slides, and a running counter tracks position.
Seamless infinite loop, no snap back at the ends
Horizontal or vertical flow, drag, wheel, and keyboard navigation
Titles anchored to each slide, six position options (behind, front, above, above front, below, below front), font linked to your project's text styles
Tag labels with divider lines, position and spacing controls
Autoplay with adjustable speed, interval, and seven easing curves
Optional liquid glass edge distortion, images only, so text always stays sharp
Supports images and video, mixed in the same carousel
Portfolio and case study strips
Product or lookbook carousels
Editorial "day by day" or "chapter by chapter" storytelling
Hero sections that need motion without a video file
Framer code component (React and TypeScript). Works in any Framer project.
Responsive: desktop, tablet, mobile.
No external libraries or assets required.
Looks best on a dark or high contrast background.
Drop the component onto any frame and resize it.
Replace the sample media with your own images or videos, titles, and tags.
Pick a direction, a title position, and an easing curve.
Turn on liquid glass if you want the edge warp, then tune strength and splay.
Marco Ponce de León
