Switches

<div class="setting-row">
  <label class="text" for="sw-1"><b>Notifications</b><small>Alerts on this device</small></label>
  <input class="switch" type="checkbox" role="switch" id="sw-1" checked aria-label="Notifications">
</div>
<div class="setting-row">
  <label class="text" for="sw-2"><b>Dark mode</b><small>Easier on the eyes at night</small></label>
  <input class="switch" type="checkbox" role="switch" id="sw-2" aria-label="Dark mode">
</div>

<label class="check" for="sw-3"><input class="switch" type="checkbox" role="switch" id="sw-3" checked><span>Wi-Fi</span></label>
<label class="check" for="sw-4"><input class="switch switch-accent" type="checkbox" role="switch" id="sw-4" checked><span>Accent colour</span></label>
<label class="check" for="sw-5"><input class="switch" type="checkbox" role="switch" id="sw-5" disabled><span>Disabled</span></label>