Switch

eCommerce switch

Switch components dedicated to building eCommerce projects.


Unchecked state



        <!-- Switch -->
        <div class="switch">
          <label for="switch5">
            Off
            <input type="checkbox" id="switch5">
            <span class="lever"></span>
            On
          </label>
        </div>

        

Checked state



        <!-- Switch -->
        <div class="switch">
          <label for="switch4">
            Off
            <input type="checkbox" id="switch4" checked="checked">
            <span class="lever"></span>
            On
          </label>
        </div>
  
      

Disabled state



        <!-- Switch -->
        <div class="switch">
          <label for="switch3">
            Off
            <input type="checkbox" id="switch3" disabled>
            <span class="lever"></span>
            On
          </label>
        </div>
  
      

without labels



        <!-- Switch -->
        <div class="switch">
          <label for="switch1">
            <input type="checkbox" id="switch1">
            <span class="lever"></span>
          </label>
        </div>

        <!-- Switch -->
        <div class="switch">
          <label for="switch2">
            <input type="checkbox" id="switch2" checked="checked">
            <span class="lever"></span>
          </label>
        </div>