Toggle Switch
A control for a setting that is on or off and takes effect the moment it is flipped.
A toggle promises immediacy. Flipping it should change the system now, with no Save. That promise is the only thing separating it from a checkbox, and breaking it — a panel of toggles with a Save button at the bottom — leaves people unsure which of their changes are already live.
Immediacy creates two obligations the checkbox does not have. The change can fail, so the toggle needs a pending state and has to revert visibly if the request does not land. And it is hard to be sure which end is “on” from the handle position alone, so the label must state what being on means — “Email notifications”, not “Enabled” — and never rely on colour as the only state indicator.
In practice
A dashboard's notification toggles fired requests with no pending or failure state. When the endpoint was down, toggles flipped visually and silently reverted on reload. Users believed alerts were off and were surprised by emails. Adding an optimistic flip, a pending state and a revert-with-message removed the complaint class.
Where teams get it wrong
- Toggles in a form with a Save button, so nobody knows what is already applied.
- No pending or error state, leaving the UI claiming a change that never saved.
- Labels like “Enabled” that do not say what is being enabled.
- Colour as the only on/off signal.
- A toggle for a destructive or expensive action with no confirmation.
( Learn more )
Related terms
All terms- CheckboxA control for independent on/off choices, any number of which can be selected at once — including none.
- Form DesignDesigning the fields, sequence, validation and error handling of a form so people can finish it without stopping to think.
- Status IndicatorA persistent signal of a system or record's current condition — distinct from a message about something that just happened.
- Radio ButtonA control for choosing exactly one option from a visible, mutually exclusive set.