Carousel
Carousel is designed to display either single or multiple slides at a time, allowing users to increment or decrement through the sequence.
Carousel is a pre-defined pattern of Salt components that uses the Embla API.
You can customize the content within carousel slides according to your needs (see the usage documentation for guidance).
Alternatively, the CarouselCard component offers a straightforward option for creating slide elements.
Bordered cards add a visual distinction to each slide, enhancing the overall appearance and making it easier for users to differentiate between individual slides.
CarouselCard can include a border by setting the bordered prop to true.
This carousel component can display multiple slides simultaneously.
Allow a recommended, 4%, of space to enable the next slide in the sequence to be visible.
Autoplay can be added through the embla plugin Autoplay, but requires additional code to support accessibility.
The example below provides accessibility support but if you compose your own, then refer to the APG guidelines.
Carousel is a pre-defined pattern of Salt components that uses the Embla API.
You can customize the content within carousel slides according to your needs (see the usage documentation for guidance).
Alternatively, the CarouselCard component offers a straightforward option for creating slide elements.
Bordered cards add a visual distinction to each slide, enhancing the overall appearance and making it easier for users to differentiate between individual slides.
CarouselCard can include a border by setting the bordered prop to true.
This carousel component can display multiple slides simultaneously.
Allow a recommended, 4%, of space to enable the next slide in the sequence to be visible.
Autoplay can be added through the embla plugin Autoplay, but requires additional code to support accessibility.
The example below provides accessibility support but if you compose your own, then refer to the APG guidelines.
Carousel is a pre-defined pattern of Salt components that uses the Embla API.
You can customize the content within carousel slides according to your needs (see the usage documentation for guidance).
Alternatively, the CarouselCard component offers a straightforward option for creating slide elements.
Bordered cards add a visual distinction to each slide, enhancing the overall appearance and making it easier for users to differentiate between individual slides.
CarouselCard can include a border by setting the bordered prop to true.
This carousel component can display multiple slides simultaneously.
Allow a recommended, 4%, of space to enable the next slide in the sequence to be visible.
Autoplay can be added through the embla plugin Autoplay, but requires additional code to support accessibility.
The example below provides accessibility support but if you compose your own, then refer to the APG guidelines.