Switch

Switch element consist of two classes. The switch container class and the switch-knob class that should go inside the switch element.

<div class="switch">
  <div class="switch-knob"></div>
</div>

Switch can be toggled by adding and removing an active class to the container.

<div class="switch active">
  <div class="switch-knob"></div>
</div>

Class Names

active - a class that should be added to the switch container when the switch is toggled on, changes the background color and the position of the knob/thumb element inside
disabled - changes the background and knob color of the switch
switch-knob - a knob or thumb element that should be placed inside the switch container
switch - a container element for the switch