tailwindcss-toggle v1.0.3

  <!-- Toggle Button -->
  <label for="toogleA" class="flex items-center cursor-pointer">
    <!-- toggle -->
    <div class="relative">
      <!-- input -->
      <input id="toogleA" type="checkbox" class="hidden toggle-input-purple-800" /><!-- Change color as desired -->
      <!-- line -->
      <div class="toggle__line w-10 h-4 bg-gray-400 rounded-full shadow-inner"></div>
      <!-- dot -->
      <div class="toggle__dot absolute w-6 h-6 bg-white rounded-full shadow -top-1/4 -left-1/4 transition duration-500 ease-in-out">           </div>
    </div>
    <!-- label -->
    <div class="ml-3 text-gray-700 font-medium">
      Toggle Me!
    </div>
  </label>