Skip to the page
Tactile UI Kit

Carousel

Slides seen one at a time through a viewer’s gate: transport keys either side of a frame counter on an LCD, lamp keys to jump, swipe on touch. Nothing moves on its own unless you ask it to.

Use the keys, the lamps, a swipe, or Tab to the gate and use the arrow keys. Watch the counter.

  • The WAI-ARIA carousel pattern: a named region with aria-roledescription="carousel"; each slide a group with aria-roledescription="slide" and a label like “2 of 4: Next session”.
  • Slides out of the gate are inert, so Tab never lands on something you cannot see.
  • The gate is a polite live region while nothing rotates, so a change of slide is read out; during rotation it is silent, and focus or hover holds it.
  • Keys have names (“Next slide”, “Slide 3: Levels”); the lit lamp is also aria-current.
  • Rotation never starts under prefers-reduced-motion, and the stop key is the first control, as the pattern asks.
Tactile UI Kit
Get the Founder Pass