Carousel

import {
  Carousel,
  CarouselContent,
  CarouselItem,
} from '@/components/ui/carousel';

<Carousel className='w-full max-w-xs'>
  <CarouselContent>
    {Array.from({ length: 5 }).map((_, index) => (
      <CarouselItem key={index}>
        <div className='p-1'>
          <Card>
            <CardContent className='flex aspect-square items-center justify-center p-6'>
              <span className='text-4xl font-semibold'>{index + 1}</span>
            </CardContent>
          </Card>
        </div>
      </CarouselItem>
    ))}
  </CarouselContent>
</Carousel>