Carousel

A carousel with motion and swipe built using Embla.

Installation

Add the carousel component with the shadcn CLI.

bash

npx shadcn@latest add https://swiss.ui.unsanity.ai/r/carousel.json

Usage

tsx

import { Carousel } from "@/components/ui/carousel"

Examples

Default

import {
  Carousel,
  CarouselContent,
  CarouselItem,
  CarouselNext,
  CarouselPrevious,
} from "@/components/ui/carousel"

<Carousel className="w-48">
  <CarouselContent>
    <CarouselItem>
      <div className="grid aspect-square place-items-center border border-border">
        1
      </div>
    </CarouselItem>
  </CarouselContent>
  <CarouselPrevious />
  <CarouselNext />
</Carousel>