Report a problem or share feedback ← Catalog

Coverflow Carousel

curatedtheme-awarefree

smoothui/coverflow-carousel

A CoverflowCarousel component for SmoothUI.

drag · state — mediumdrop-inPremium Playful

Open live demo Compare with similar

$npx shadcn@latest add @smoothui/coverflow-carousel

npm deps: motion

Our notes

3D coverflow (rotateY + depth + scale per offset) with drag/swipe, arrow keys, optional autoplay and an aria-live slide announcer; drag turns off under reduced motion (the upstream hasReducedMotion flag is wrong — the code uses useReducedMotion). Cards are bg-background with a foreground/10 ring. Prev/next come from @smoothui/smooth-button (auto-installed), which uses SmoothUI's smooth-N grey ramp from tokens.json.

Source: SmoothUI
Kind: component
Categories: carousel
Use as: drop-in — replaces your component
Applies to: carousel image
Motion: on drag, state · medium · motion · medium cost · respects reduced motion
Tags: spring, complexity-medium
Licence: MIT ("MIT License — Copyright (c) 2024 Eduardo Calvo", github.com/educlopez/smoothui).
Live demo: smoothui.dev
Docs: smoothui.dev

Similar

Compare all 4 →