Carousel

A carousel with motion and swipe built using Embla.

Examples

Default

1

2

3

4

5

<Carousel class="w-full max-w-xs">
  <CarouselContent>
    <CarouselItem v-for="(_, index) in 5" :key="index">
      <div class="p-1">
        <Card>
          <CardContent class="flex aspect-square items-center justify-center p-6">
            <span class="text-4xl font-semibold">{{ index + 1 }}</span>
          </CardContent>
        </Card>
      </div>
    </CarouselItem>
  </CarouselContent>
  <CarouselPrevious />
  <CarouselNext />
</Carousel>