Carousel
A track of slides you throw with a finger, a mouse or a trackpad: the release velocity picks the slide and the snap carries it on a spring, and past either end the track stretches like rubber.
$149 once · every Pro piece
Customize
Under it a hairline fills as you go, its head hot while the track moves.
Install
npx shadcn@latest add @obsyde/carouselNeeds your licence key · Get Pro
Usage
Import it from where the CLI puts it, or copy the files below by hand.
import { Carousel } from '@/components/obsyde/ember/carousel/Carousel';
export function Example() {
return (
<Carousel />
);
}
Files
What you get with Pro: plain React, TypeScript and CSS, with no dependencies.
ember/carousel/Carousel.tsxcomponentember/carousel/carousel-demo.cssstylesember/carousel/carousel.cssstylesember/carousel/CarouselDemo.tsxdemoember/basics-kit/kit.tssharedember/shared/spring.tssharedember/shared/accent.tssharedember/shared/ember.cssshared
API
| Prop | Type | Default |
|---|---|---|
accentAccent | 'ember' | 'volt' | 'arc' | 'ember' |
countSlides | number | 6 |
slideWidthSlide width | number | 1 |
gapGap | number | 12 |
defaultIndexStart at | number | 0 |