Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs minimaliste avec prise en charge du thème sombre à l’aide de Tailwind CSS.
HTML Code
<div class="flex items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900">
<div class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-md w-96">
<h2 class="text-2xl font-semibold text-gray-800 dark:text-gray-200 text-center mb-4">Two-Factor Authentication</h2>
<p class="text-gray-600 dark:text-gray-400 text-center mb-6">Please enter the code sent to your registered email.</p>
<div class="flex justify-center mb-4">
<img class="w-16 h-16 rounded-full border-2 border-gray-300" src="https://randomuser.me/api/portraits/men/5.jpg" alt="avatar">
</div>
<div class="mb-4">
<input type="text" placeholder="Enter Code" class="w-full p-2 border border-gray-300 rounded focus:outline-none focus:ring focus:ring-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:text-gray-200" />
</div>
<div class="flex justify-between items-center mb-4">
<button class="w-full bg-blue-500 text-white py-2 rounded hover:bg-blue-400 transition duration-300">Verify</button>
</div>
<div class="text-center">
<p class="text-gray-600 dark:text-gray-400">Didn't receive the code? <a href="#" class="text-blue-500 hover:underline">Resend</a></p>
</div>
</div>
</div>Composants associés
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs minimaliste conçu pour un portefeuille avec une palette de couleurs triadique. Il dispose d’une interface propre et interactive prenant en charge le mode sombre, construite à l’aide de Tailwind CSS.
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs complexe de l’interface utilisateur en mode sombre avec des couleurs sourdes, adapté aux sites Web d’événements/conférences. Comprend des champs de saisie pour les codes, des options de renvoi et de modification de méthode, ainsi qu’un appel à l’action clair.
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs réactif conçu avec Neumorphism dans une palette de couleurs vives, adapté aux sites Web d’entreprise et prenant en charge le mode sombre avec Tailwind CSS.