Switch

import clsx from 'clsx/lite';

export default function App() {
  return (
    <div>
      <label className={clsx(
        'flex rounded-full h-8 w-16',
        'bg-[#d1d5db] border border-[#d1d5db]',
        'mb-2' // for demo

      )}>
        <input type="checkbox" className='hidden' />
        <div className='w-8 bg-white rounded-full' />
      </label>

      <label className={clsx(
        'flex rounded-full h-8 w-16',
        'bg-[#357edd] border border-[#357edd] justify-end'
      )}>
        <input type="checkbox" className='hidden' />
        <div className='w-8 bg-white rounded-full' />
      </label>
    </div>
  );
}