Forms and settings
Switch
components/ui/switchOn and off, with a click that pitches with the state.
Switch live demo
Spatial audio
Place sounds in the stereo field
Haptics
Pair each sound with a vibration
Craft notes
- A damped wooden click that pitches up for on and down for off
- The thumb travels on a slightly overshooting curve over 250 ms
- Setting rows make the whole line a click target while the switch keeps role="switch"
Play it
Flip it quickly a few times, then use Space from the keyboard.
Sounds: toggle
Variants
Every prop combination the component supports. The chip on each card is the exact props it passes.
Setting row
label="..." description="..."Label, hint and switch as one target.
Spatial audio
Place sounds in the stereo field
Haptics
Pair each sound with a vibration
On its own
label="Spatial audio"With an accessible name instead of a visible label.
Disabled
disabledLocked in its current state.
Silent
silentMutes this instance only.