Checks and radios
Create consistent cross-browser and cross-device checkboxes and radios
with our completely rewritten checks component.
Checkboxes
Disabled Checkbox
Add the disabled attribute and the associated <label>s are automatically styled to match with a lighter color to help indicate the input’s state.
Radios
Disbaled Radio
Add the disabled attribute and the associated <label>s are automatically styled to match with a lighter color to help indicate the input’s state.
Switches
A switch has the markup of a custom checkbox but uses the .form-switch class to render a toggle switch. Consider using role="switch" to more accurately convey the nature of the control to assistive technologies that support this role. In older assistive technologies, it will simply be announced as a regular checkbox as a fallback. Switches also support the disabled attribute.
Disabled Switch
Add the disabled attribute and the associated <label>s are automatically styled to match with a lighter color to help indicate the input’s state.