Switch
html
<div class="flex items-center space-x-2">
<label
class="relative inline-flex h-6 w-[46px] items-center rounded-full transition-all duration-150 cursor-pointer"
>
<input type="checkbox" value="" checked="checked" class="sr-only peer" />
<span
class="w-11 h-6 bg-gray-200 peer-focus:outline-none ring-0 rounded-full peer dark:bg-gray-900 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-black-500"
></span>
</label>
<span
class="text-sm text-slate-600 font-Inter font-normal"
style="font-family: Inter, Bangla226, sans-serif;"
>Active Switch</span
>
</div>