Components
Lightswitch
Lightswitches communicate immediate on or off state for binary settings.
Basic Usage
Use a lightswitch for binary settings where the current state should be immediately visible.
Sizes
The reduced size scale is useful when lightswitches appear in dense settings rows or supporting metadata panels.
Checked
Use checked state for persisted settings so the current toggle value is immediately visible.
Disabled
Disable the toggle when the setting is shown for context but cannot currently be changed.
Labels
Pair switches with clear labels when the setting needs more context than the control alone can provide.
API reference
Lightswitch wraps Base UI Switch. Use the Base UI API reference for checked state, disabled behavior, form integration, and switch accessibility details.
Edit this page
Last updated: May 22, 2026, 6:53 PM