Carousel

A carousel is a UI component that displays a series of content items in a rotating or swipeable sequence. Research consistently shows carousels underperform static layouts for most use cases.

What is a carousel in UX design?

A carousel is a UI component that displays multiple content items, typically images or cards, in a sequential rotating display. Users can advance through items using navigation arrows, indicator dots, or swipe gestures. Carousels may advance automatically on a timer or only on user interaction. They are commonly used on marketing homepages, product image galleries, and featured content sections where multiple items compete for a single prominent position.

Why do carousels often hurt usability?

Research from multiple usability studies consistently shows that carousels underperform static layouts for most use cases. Users rarely interact with items beyond the first or second position. Auto-advancing carousels are particularly problematic because they move content before users have finished reading, create accessibility issues for users who need more time, and can trigger motion sensitivity in some users. The banner blindness effect means users often ignore carousel content entirely because it resembles advertising. Content placed in positions two through five in a carousel effectively does not exist for most users.

When is a carousel appropriate in UX design?

Carousels are most defensible for product image galleries where users explicitly expect to browse multiple photos of the same item, and for content where sequential order is meaningful and users have opted into viewing a series. They are more effective when controlled entirely by user interaction rather than auto-advancing. On mobile, swipeable carousels that reveal partial next items provide a strong visual affordance for scrollability and tend to perform better than desktop carousel patterns.

How to design an accessible carousel?

Accessible carousels require keyboard navigation for all controls. Auto-advancing must pause when the carousel receives focus or the user hovers over it. A pause or stop control must be provided for auto-advancing carousels. Navigation controls must have descriptive labels. Each slide must have a meaningful title or label. Indicator dots must communicate which item is currently displayed and allow direct navigation to any item. These requirements significantly increase implementation complexity, which is one reason to carefully evaluate whether a carousel is the best solution for the content.

Related terms

Related guides