THEME
MOTION
HAPTIC
SOUND
TOGGLE
Binary on/off switch with square-cornered track and accent fill when on.
Live demo
Import
import { Toggle } from '@cathode-ui/react';Props
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
value | boolean | — | yes | |
onChange | (v: boolean) => void | — | yes | |
label | string | — | — | |
accent | 'success'|'info'|'warning'|'danger'|'accent'|'amber'|'pink'|'purple'|'teal' | success | — | |
disabled | boolean | false | — |
Examples
basic
<Toggle value={on} onChange={setOn} label="ENABLED" />Accessibility
Role: switch
- aria-label if no visible label
Feedback
| Haptic | tap |
| Sound | tick |
Motion states
idle · press