carousellisted

# Carousel Display multiple items in a rotating view ## What it solves A **carousel** displays content or images in a rotating or sliding manner. Users navigate through content with arrows, dots, or swipe gestures on touch devices. Carousels showcase featured content, promotions, or image galleries in limited space. ## When to use Use carousels to display **related content or images in limited space** while keeping users engaged. **Common use cases include:** - Featured products or services need showcasing (homepage promotions) - Key messages or storytelling require highlighting (step-by-step guides) - Portfolio of work or case studies needs display - Testimonials or customer reviews for presentation - Multi-step processes or tutorials guide users - News updates or event announcements get featured ## When to avoid - Critical content needs immediate user interaction - Content lacks clear relationship or narrative flow - Users must compare items side-by-side or view all options at once - Too many carousel items make navigation cumbersome - Complex content requires significant reading time ## Implementation workflow 1. Confirm the pattern matches the problem and constraints before copying the example. 2. Start from the anatomy and examples in `references/pattern.md`, then choose the smallest viable variation. 3. Apply accessibility, performance, and interaction guardrails before layering visual polish. 4. Use the testing guidance to verify behavior across keyboard, scre