Flex Carousel

Flex Carousel

Type

Component

Plateforme

Framer

Créé en

2026

Type

Component

Plateforme

Framer

Créé en

2026

11
1

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