2.6.3 #Components.checkbox.no-label No label

Toggle example guides Toggle HTML markup

A complete different checkbox component, more flexible (not dependent of a DOM label element)

Browser support: IE11+, Safari6+, Firefox30+, Chrome30+

Markup 
<div class="sb-checkbox-without-label sb-margin-xs">
  <input type="checkbox" id="checkbox-without-label-1" class="sb-checkbox-without-label__input">
  <div class="sb-checkbox-without-label__checkmark-container">
    <svg class="sb-checkbox__checkmark" viewBox="0 0 11 11" focusable="false" aria-hidden="true" role="presentation">
      <path d="M9 2C6.815 3.706 5.258 5.706 4.329 8 3.709 7.081 2.972 6.114 2 5.596" fill="none" stroke-width="2" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/>
    </svg>
  </div>
</div>
<div class="sb-checkbox-without-label sb-margin-xs">
  <input type="checkbox" id="checkbox-without-label-2" class="sb-checkbox-without-label__input" checked>
  <div class="sb-checkbox-without-label__checkmark-container">
    <svg class="sb-checkbox__checkmark" viewBox="0 0 11 11" focusable="false" aria-hidden="true" role="presentation">
      <path d="M9 2C6.815 3.706 5.258 5.706 4.329 8 3.709 7.081 2.972 6.114 2 5.596" fill="none" stroke-width="2" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/>
    </svg>
  </div>
</div>
<div class="sb-checkbox-without-label sb-margin-xs">
  <input type="checkbox" id="checkbox-without-label-3" class="sb-checkbox-without-label__input" disabled>
  <div class="sb-checkbox-without-label__checkmark-container">
    <svg class="sb-checkbox__checkmark" viewBox="0 0 11 11" focusable="false" aria-hidden="true" role="presentation">
      <path d="M9 2C6.815 3.706 5.258 5.706 4.329 8 3.709 7.081 2.972 6.114 2 5.596" fill="none" stroke-width="2" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/>
    </svg>
  </div>
</div>
<div class="sb-checkbox-without-label sb-margin-xs">
  <input type="checkbox" id="checkbox-without-label-4" class="sb-checkbox-without-label__input" checked disabled>
  <div class="sb-checkbox-without-label__checkmark-container">
    <svg class="sb-checkbox__checkmark" viewBox="0 0 11 11" focusable="false" aria-hidden="true" role="presentation">
      <path d="M9 2C6.815 3.706 5.258 5.706 4.329 8 3.709 7.081 2.972 6.114 2 5.596" fill="none" stroke-width="2" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/>
    </svg>
  </div>
</div>
Source: components/_checkbox.scss, line 242