← All patterns · Input widgets

Listbox

List of selectable options, single- or multi-select.

Pattern

A listbox presents a fixed set of options the user picks from. Single-select listboxes always have one option selected; multi-select listboxes allow zero or more.

Roles

  • listbox
  • option

States and properties

aria-multiselectable
true if multiple options can be selected.
aria-selected
On each option; true / false.
aria-activedescendant
On listbox; the focused option's id.

Keyboard interaction

Up / Down arrow
Move focus.
Home / End
First / last option.
Space
Toggle selection (multi-select).

WCAG criteria

  • 2.1.1 — Keyboard
  • 4.1.2 — Name, Role, Value

Canonical reference

WAI-ARIA Authoring Practices Guide — Listbox

More