Toggles

<div class="flex items-center">
  
  <button 
    type="button" 
    class="relative inline-flex flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2 h-6 w-11 bg-gray-200" 
    role="switch" 
    aria-checked="false"
    
  >
    <span class="sr-only">Use setting</span>
    <span 
      aria-hidden="true" 
      class="pointer-events-none inline-block transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out h-5 w-5 translate-x-0"
    ></span>
  </button>
  
  <span class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300">
    Toggle me
  </span>
</div>