Switch

For using our customized radio, you need to use .custom-form-input class for input, .custom-form-label class for label, .custom-form-control and .switch classes for the wrapper.

<div class="custom-form-control switch">
  <input class="custom-form-input" id="custom-switch" type="checkbox" name="" />
  <label class="custom-form-label" for="custom-switch">Switch</label>
</div>
<div class="custom-form-control switch">
  <input class="custom-form-input" id="switch-disable" type="checkbox" disabled checked />
  <label class="custom-form-label" for="switch-disable">Switch Disabled</label>
</div>

Colors

<div class="custom-form-control switch blue">
  <input class="custom-form-input" id="switch-blue" type="checkbox" />
  <label class="custom-form-label" for="switch-blue">Switch Blue</label>
</div>
<div class="custom-form-control switch green">
  <input class="custom-form-input" id="switch-green" type="checkbox" />
  <label class="custom-form-label" for="switch-green">Switch Green</label>
</div>
<div class="custom-form-control switch yellow">
  <input class="custom-form-input" id="switch-yellow" type="checkbox" />
  <label class="custom-form-label" for="switch-yellow">Switch Yellow</label>
</div>
<div class="custom-form-control switch red">
  <input class="custom-form-input" id="switch-red" type="checkbox" />
  <label class="custom-form-label" for="switch-red">Switch Red</label>
</div>
© 2019, Built with  🎧☕️❤️& Gralig.