Skip to main content

Switch

Switch is a binary toggle control.

When to use​

When not to use​

Accessibility​

  • Provide an accessible name (e.g., via aria-label or an associated <label>).
  • Use role="switch" and keep aria-checked in sync with the visual state.
  • Ensure the switch can be toggled with keyboard (Space or Enter).
  • Maintain sufficient contrast for the thumb and track in both on and off states.

Changelog​

  • 2026-06-29 — Initial doc generated from Figma.