Toggle
On/off switch with optional track icons (defaults check/xmark). Heights match Checkbox/Radio (22/20/18/16). Public API maps Figma Toggle + Label; track chrome from Toggle building block. Distinct from IconToggle.
Appearance
Content
State
Accessibility
Props — Toggle
View MUI docs| Prop | Type | Description |
|---|---|---|
size | "large" | "medium" | "small" | "extraSmall" | Track and label scale. |
labelPlacement | "left" | "right" | Label on the left or right of the switch. |
label | ReactNode | Label beside the switch. |
checked | boolean | Controlled on/off state. |
defaultChecked | boolean | Uncontrolled initial on/off state. |
disabled | boolean | Disables interaction. |
onChange | (event, checked) => void | Called when toggled. |
hasIcons | boolean | Show check/xmark icons on the track. |
onIcon | FaIconName | Track icon when on. Ignored when hasIcons is false. |
offIcon | FaIconName | Track icon when off. Ignored when hasIcons is false. |
aria-label | string | Required when unlabeled. |