Flex Carousel
Flex Carousel
Type
Component
Plateforme
Framer
Créé en
2026
Type
Component
Plateforme
Framer
Créé en
2026

Un carousel d’images infini qui se courbe avec une déformation effet glass
Flex Carousel fait défiler une rangée infinie d’images à travers une lentille de verre invisible. Au drag, au scroll ou aux flèches du clavier, la rangée se courbe là où elle croise le bord du verre, avec un léger éclat arc-en-ciel le long de la courbe. Au clic, une card passe en focus : les autres s’écartent, la courbe se dissout et l’image s’agrandit.
Partez d’un preset (Liquid, Ribbon, Vortex, Arch) ou passez en Custom pour sculpter la lentille vous-même : largeur, hauteur, tilt, roundness, bend, reach et dispersion. Choisissez le sens dans lequel les extrémités s’enroulent, laissez le verre onduler comme un liquide, ou faites-le suivre le curseur comme une loupe.
Animations et défilement du carousel
Quatre intros au choix : Rise, Bloom, Spin et Deal
Boucle infinie avec snap élastique et drag avec inertie
Trois modes de scroll : Capture, On Page (le scroll de la page fait défiler la rangée, idéal en hero) ou Off
Les cards se compressent légèrement quand la rangée défile vite
Autoplay optionnel, en pause au hover, au focus et à l’interaction
Images, format et légendes
Ratio natural, ou crop de toutes les cards en Portrait, Square ou Landscape
Hauteur des cards, gap et radius ajustables
Titre et sous-titre par image, avec un compteur animé sous la rangée
Typo et couleur des légendes entièrement libres
Focus, clavier et interactions
Clic pour ouvrir une card en focus, puis clic, drag, scroll ou Échap pour la refermer
Navigation complète au clavier : flèches, Home, End, Entrée
Events On Change et On Select pour déclencher vos propres interactions
Rendu WebGL et performance
Rendu GPU en WebGL, sans librairie externe
Le rendu se met en pause dès que le carousel sort du viewport
Respecte le réglage de réduction des animations
Aperçu fixe directement sur le canvas
