minflow

Display

Carousel

Drag it, throw it, or click a dot: the panes settle on the nearest slide either way, and the active pager dot stretches into a pill and slides between positions instead of repainting. Panes that are off screen are hidden from assistive technology, so a screen reader gets the current slide rather than the whole deck at once.

npx shadcn@latest add @minflow/carousel

Where to use it

  • Small sets of equal-weight media: screenshots, covers, templates.
  • Onboarding, where three or four panes is the whole story.
  • Never for content the reader must not miss, and never past about five panes; that is a list or a grid.

Variations

Media panes

The default. Equal-weight images where the point is to browse rather than to compare.

Tokens

Content panes

When the panes carry text instead of media. Keep every pane the same height, because a carousel that changes height on each slide moves the page under the reader.

One palette

Every colour resolves through a token, so both themes stay in step.