Carousel Component
The basic carousel (V1) allows for a number of components to be added as individual carousel items. Carousel items can be the same type or not. Each slide contains one item.
The height of the carousel is determined by the intrinsic height of the content that is currently shown. To prevent height jumps, ensure that all items have the same aspect ratio. It may be possible to set a min-height through the component style policy.
No Style Applied
This style has dark mode styles and is less suited for a full overlay of the controls. Use Padding to keep the controls outside of the content.
- Slide 1
- Slide 1
Primary Style Applied
This style has dark mode styles and is less suited for a full overlay of the controls. Use Padding to keep the controls outside of the content.
- Slide 1
- Slide 2
Primary Circle Arrow Applied
This style has dark mode styles and is less suited for a full overlay of the controls. Use Padding to keep the controls outside of the content.
- Slide 1
- Slide 2
Secondary Style Applied
This style has dark mode styles and is less suited for a full overlay of the controls. Use Padding to keep the controls outside of the content.
- Slide 1
- Slide 2
Secondary Circle Arrow Applied
This style has dark mode styles and is less suited for a full overlay of the controls. Use Padding to keep the controls outside of the content.
- Slide 1
- Slide 2
Light Neutral Style Applied
This style has dark no mode style and is suited for a full overlay of the controls.
Use light or dark based on the darkness or lightness of the content.
NOTA BENE: The Previous and Next actions cover the carousel content.
Any links or cta's covered will not be functional!
- Slide 1
- Slide 2
Light Circle Arrow Applied
This style has dark no mode style and is suited for a full overlay of the controls.
Use light or dark based on the darkness or lightness of the content.
NOTA BENE: The Previous and Next actions cover the carousel content.
Any links or cta's covered will not be functional!
- Slide 1
- Slide 2
Dark Neutral Style Applied
This style has no dark mode style and is suited for a full overlay of the controls.
Use light or dark based on the darkness or lightness of the content.
NOTA BENE: The Previous and Next actions cover the carousel content.
Any links or cta's covered will not be functional!
- Slide 1
- Slide 2
Dark Circle Arrow Applied
This style has no dark mode style and is suited for a full overlay of the controls.
Use light or dark based on the darkness or lightness of the content.
NOTA BENE: The Previous and Next actions cover the carousel content.
Any links or cta's covered will not be functional!
- Slide 1
- Slide 2