Infinite Carousel

Overview

Infinite Carousel keeps a card sequence in motion. Drag it, tap it, nudge it, and the lineup keeps arriving.

Use Infinite Carousel when a small set of cards should feel browseable without a hard end. It fits product showcases, property listings, campaign cards, feature highlights, and visual collections where the user can explore at their own pace. The page job is momentum: the next card should feel close without hiding the current one.

The production risk is fake infinity. Looping carousels often duplicate slides visually and accidentally confuse focus order, screen readers, analytics, or active-state logic. The loop can be visual; the content model still needs to remain honest.

Install Command

Usage Code

Component Code

Example Production Use Case

A property landing page can use Infinite Carousel to let visitors drag through a set of premium locations and property types. The outcome is momentum: the browsing interaction feels fluid while each card still carries a clear title, description, and decision cue.

Best Used For

• Product, property, and campaign card sets where browsing is exploratory.
• Visual collections where drag and arrow controls make the section feel active.
• Medium-sized card groups where looping helps movement but does not replace discovery.

Not For

Not for pricing, legal copy, critical proof, comparison tables, or content users must see all at once.

Not for long card archives where filtering, search, or a grid would serve the visitor better.

Performance Budget

Keep card count reasonable, lazy-load heavy media, avoid expensive re-renders during drag, and clean up pointer and animation listeners on unmount.

Accessibility and Mobile

Provide arrow buttons, keyboard access, visible focus, and swipe support. Screen readers should encounter each real item once. Reduced-motion users should get a non-looping or static sequence.

Common Mistakes

• Duplicating looped cards in the accessibility tree.
• Autoplaying the carousel without pause or user control.
• Making drag the only way to reach hidden cards.