When to use
- To turn something on or off, like enabling notifications or toggling a setting.
- For immediate actions where changes happen instantly and don’t require confirmation (e.g., turning on dark mode).
When to use something else
- Deferred or form-bound changes: use Checkbox or explicit Button submit.
- One-shot actions (delete, submit): use Button.
- Several related on/off settings: use Toggle group, Checkbox, or Select—not a single Switch per unrelated setting.
Dos and don’ts
- Do use clear descriptive labels to explain what the Switch controls.
- Don’t use Switches inside Menus to toggle a setting on/off (e.g., “Show grid lines”, “Show axis”). Instead, use a toggle menu item that displays a checkmark when something is on and remove the checkmark when something is off.
- Don’t use Switches for destructive actions.
Behavior
- Toggles immediately on interaction; state should reflect the backing setting without requiring a separate submit unless the form pattern says otherwise.
- Do not embed Switch in Menu rows; use menu checkmark toggles per guidance above.