Switches are used to quickly toggle between two possible states. They are commonly used for “on/off” switches.
||Switch||A class representing a switch|
To disable a switch, add the following class:
||Disabled||Use whenever clicking on a switch isn’t allowed.|
There are three sizes of selectors: small, medium, and large. Each size has its own purpose, so make sure you use every size correctly.
Switches next to labels should have at minimum 8px of space in between for legibility. Switches should be aligned to the center of a single line of text. If there are multiple lines in a label, switches should be aligned to the center of the first line in the label.
Switches refer to a single item and allow turning an item on or off.
If each item in a set can be independently controlled, use switches to allow on or off options.
Do not use radio buttons to allow on or off options.