Switch
Binary on/off control.
Quick Preview
Receive property status updates.
Usage
<Switch aria-label="Enable notifications" />Examples
Sizes and States
Use size for control density and loading when a toggle change is pending.
Uses the default medium size.
Props
| Prop/API | Type | Default | Description |
|---|---|---|---|
size | `"sm" | "md" | "lg"` |
loading | boolean | false | Shows pending state. |
className | string | - | Local layout or spacing overrides. |
| native/root props | React component props | - | Passed through to the underlying root or primitive. |
Accessibility
- Provide visible labels or accessible names for interactive controls.
- Preserve the component-provided focus, keyboard, disabled, and invalid-state behavior.
- Do not communicate state with color alone; include text, icons, or helper copy.