Aug 21, 2022
One of my favorite pedantic UI topics! The line is very blurry between these two controls, but one way I draw it is to consider the mental model you’re trying to create.
If the model is “include/exclude” or “applies / doesn’t apply” I prefer the checkbox. This is because of the checkbox’s history in paper forms: the ones you’d fill out to order something or submit an application.
- “Send me emails for special offers and news”
- “Use billing address as shipping address”
- “Extra spicy”
If the model is “enable/disable” or “on/off” I prefer the switch. This is because of the switch’s resemblance to a switch you’d see on a physical machine.
- “Airplane mode”
- “Do not disturb”
- “Autocorrect”