Switch
Switch toggles the on or off state of the input.
1. Alike components
Checkboxes are often confused with radio buttons and switches in some use cases. The guidance below helps to differentiate the difference.
| Switches | Checkboxes | Radio buttons | |
|---|---|---|---|
| Minimum #of options to use | Only one (on or off) | At least one | At least two |
| Are the choices mutually exclusive? | N/A (independent) | No | Yes |
| Does the choice need a submission to take effect? | No | Yes | Yes |
| Is there an un-checked state? | No (always on or off) | Yes | Yes |
| Can you toggle the state at the same place? | Yes | Yes | No |
2. Switches vs checkbox
Don't
Don’t use switches if submissions are required. Switch takes effect on action.
Do
Use checkboxes when submission is need to take effect