Classiques (solides et simples)
- Slide (défilement horizontal/vertical). Démos et API dans Swiper. (Swiper)
- Fade (fondu enchaîné). Swiper, Splide (intégré), Embla (plugin). (Swiper, splidejs.com, embla-carousel.com)
- Autoplay + Loop + Parallax léger (pour bannières). Swiper regroupe tout ça. (Swiper)
3D “wow” (CSS transform + WebGL fallback parfois)
- Cube 3D, Flip 3D, Coverflow, Cards, Creative (mix d’effets). Démos prêtes à copier-coller dans Swiper. (Swiper)
- Perspective/Depth animée avec GSAP pour sliders custom (exemples et fils de discussion). (showcased.webflow.io, gsap.com)
WebGL / Shaders (effet “studio”)
- Liquid/Displacement (distorsion fluide entre images). Codrops + PixiJS. (Codrops, pixijs.io)
- Warp/Noise/Distortion (Creative WebGL transitions). Codrops (avec Three.js). (Codrops)
- Triangles/Fragments (triangular reveal). Codrops (WebGL). (Codrops)
- RGB Split + Kinetic slider (PixiJS + GSAP, open-source). (GitHub)
Librairies de carrousel (avec effets intégrés ou extensibles)
- Swiper – la référence touch, avec effets fade/cube/coverflow/flip/cards/creative + tonnes de démos. (Swiper)
- Splide – léger, accessibilité soignée, slide/fade, boucle, options claires. (splidejs.com)
- Embla – très fluide, API extensible, fade via plugin, transitions type “ressort”. (embla-carousel.com, GitHub)
- Glide.js – minimaliste, rapide, options simples (exemples sur CodeSandbox). (glidejs.com, CodeSandbox)
- Flickity – touch & “flickable”, plutôt orienté slide (pas de fade natif). (flickity.metafizzy.co, GitHub)
Transitions de page/sections (pour bannières full-screen ou “hero”)
- Barba.js + GSAP – fondu croisé, masques, wipes, révélations entre vues. Docs + démo repo. (barba.js, GitHub)
- Fils GSAP sur page transitions (patterns, snippets). (gsap.com)
Idées “spectaculaires” prêtes à piocher (démos)
- Liquid Distortion Slideshow (PixiJS). (Codrops)
- Creative WebGL Image Transitions (collection d’effets). (Codrops)
- Pixel/Grid displacement + RGB shift (Three.js, avancé). (Codrops)
- Kinetic Slider (RGB + displacement). (GitHub)
- Swiper 3D: Cube / Coverflow / Flip (démos officielles). (Swiper)
Quand choisir quoi ?
- Bannière légère / perf d’abord → Fade ou Slide avec Splide/Embla/Glide. (splidejs.com, embla-carousel.com)
- Carousel “wow” sans WebGL → Swiper Cube/Flip/Coverflow. (Swiper)
- Hero immersif → WebGL (displacement/warp) via PixiJS/Three.js + GSAP. (pixijs.io, Codrops)
- Transitions entre pages → Barba.js + GSAP. (barba.js)
Si tu veux, je peux te générer un mini-projet avec 3 variantes (fade, 3D Swiper, WebGL displacement) que tu pourras lancer direct (npm/pnpm) et piocher l’effet qui te plaît.