Switch

A switch has the markup of a custom checkbox but uses the .custom-switchclass to render a toggle switch. Switches also support the disabledattribute.

Toggle Switch

.custom-switch
On / Off
Off / On
Disabled 
<divclass="custom-control custom-switch"><inputtype="checkbox"class="custom-control-input"id="customSwitch1"><labelclass="custom-control-label"for="customSwitch1">Toggle this switch element</label></div>
<divclass="custom-control custom-switch"><inputtype="checkbox"class="custom-control-input"id="customSwitch2"disabled><labelclass="custom-control-label"for="customSwitch2">Toggle this switch element</label></div>

Outline

.custom-switch-outline
On / Off
Off / On
Disabled

Square

.custom-switch-square
On / Off
Off / On
Disabled