Skip to the page
Tactile UI Kit

List

Rows in a rack: a mark, a title, a second line and a fact or a key at the end. Chosen rows sink into a recess with their check key latched; in a running order, a row lifts out of the rack on its skirt and slides past the others — from the keyboard or by its grip.

Choose takes with a click, or Tab in and use the arrows and Space. In the running order, press Space on a grip, move with the arrows, Space to drop — or drag the grip.

  • A plain list is a list: rows are read with their title, second line and fact, in order.
  • Selectable lists follow the listbox pattern: one tab stop, aria-activedescendant for the active row, aria-selected for chosen ones. The check key and the recess show it twice over.
  • Reordering follows the grab-and-move model: the grip is a toggle (aria-pressed) named “Move Intro”; every lift, move, drop and cancel is announced in a live region with the new position.
  • Dragging is a second way to reorder, never the only one.
Tactile UI Kit
Get the Founder Pass