Carousel Example

With lightbox

/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg

Without lightbox

/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg
/francesco-ungaro.jpg
/the-chaffins.jpg
/nathan-gordon.jpg

How to use this multiselect

Props

Playground

Import from filigran-ui :

Import {Carousel} from 'filigran-ui/client'


                     <Carousel>
        {[
          '/filigran-ui/francesco-ungaro.jpg',
          '/filigran-ui/the-chaffins.jpg',
          '/filigran-ui/nathan-gordon.jpg'
        ].map((img) => {
          return (
            <CarouselItem
              key={img}
              className="h-[500px]">
              <img
                src={img}
                alt={img}
              />
            </CarouselItem>
          )
        })}
      </Carousel>