Carousel

We use the Splide NPM package for building accessible carousels.

It is strongly recommended to follow the getting started instructions to make sure you have the correct markup for your implementation, as it can vary depending on the nature of the carousel.

In keeping with Amplify's principle of favouring data-attributes over classnames for targeting JS, be sure to include the following attribute on the carousel: data-component="carousel".

We use the core Splide stylesheet so that we can write custom styles while minimizing the need for overrides. A number of JS customisation options are also available.