Carousel

A simple carousel component that navigates through other components, like banners, news items, media and other card-like components. The component is still under development. If you notice any issues, weird behavior or bugs, notify the Design Team

STATUS: This component is in preview.

Basic

The Carousel component takes in any list of elements. The carousel supports carousel-logic such as arrows for navigation, scrollbar and item counter (smale screens). The items have scroll-behavior set to center, and will automatically try to center the focused item.

The carousel does not style its children apart from positioning, to add focus rings and hover effects, like previous versions, look at the example below.

Spillevett

Spillevett specific example.

Images

The carousel can be used with any sort of child component, like the example below using images.

fullWidth

The carousel can be used in full width.

ignoreContainerWidth

The carousel can ignore its container width constraints, allowing it to span over the entire width of the screen.