<div class="switch-example-wrapper sb-margin-bottom-l sb-flex sb-align-items-center">
 <span id="defaultState" class="sb-margin-right-s">Default state</span>
 <div class="sb-switch [modifier class]">
   <input type="checkbox" class="sb-switch__input" id="switch-1-[modifier class]" aria-labelledby="defaultState" />
   <label for="switch-1-[modifier class]" class="sb-switch__track">
     <span class="sb-switch__icon-on"></span>
     <span class="sb-switch__icon-off"></span>
     <span class="sb-switch__handle"></span>
   </label>
 </div>
</div>
<div class="switch-example-wrapper sb-margin-bottom-l sb-flex sb-align-items-center">
 <span id="disbaledState" class="sb-margin-right-s">Disabled state</span>
 <div class="sb-switch [modifier class]">
   <input type="checkbox" class="sb-switch__input" id="switch-disabled-[modifier class]" aria-labelledby="disabledState" disabled />
   <label for="switch-disabled-[modifier class]" class="sb-switch__track">
     <span class="sb-switch__icon-on"></span>
     <span class="sb-switch__icon-off"></span>
     <span class="sb-switch__handle"></span>
   </label>
 </div>
</div>
<div class="switch-example-wrapper sb-flex sb-align-items-center">
 <span id="disabledOnState" class="sb-margin-right-s">Disabled - On state</span>
 <div class="sb-switch [modifier class]">
   <input type="checkbox" class="sb-switch__input" aria-checked="true" id="switch-disabled-on-[modifier class]" checked disabled aria-labelledby="disabledOnState" />
   <label for="switch-disabled-on-[modifier class]" class="sb-switch__track">
     <span class="sb-switch__icon-on"></span>
     <span class="sb-switch__icon-off"></span>
     <span class="sb-switch__handle"></span>
   </label>
 </div>
</div>