Switch
Default 29 × 18px · Small 25 × 16px · Reicon on/off marks
Size × valueRestingHoverPressedFocusDisabledDefault · Off
Default · On
Small · Off
Small · On
With label and helper text
Notify me when an order is ready.
Size × valueRestingHoverPressedFocusDisabledDefault · Off
Default · On
Small · Off
Small · On
With label and helper text
Notify me when an order is ready.
Hover and pressed retain resting colors. Focus uses a 1px surface gap, 2px solid edge and 2px soft halo. Disabled reduces the entire control to 50% opacity.