Expand / Collapse Widget (Accessible)

These examples show an accessible expand/collapse (disclosure) pattern. Each widget is wrapped in a container with the class "example". The revealed content container uses the class "details". Use Enter/Space to toggle the buttons.

Specifications

  • Weight: 420g
  • Dimensions: 120 × 70 × 8 mm
  • Battery life: up to 18 hours

These details are visible by default to illustrate a widget that starts expanded.