Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs simple doté d’une palette de couleurs vives et d’éléments de conception 3D adaptés aux sites Web d’entreprise.
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 shadow-2xl rounded-lg p-8 transform hover:scale-105 transition-transform duration-300 ease-in-out">
<h2 class="text-2xl font-bold text-center text-blue-600 dark:text-blue-400 mb-6">Two-Factor Authentication</h2>
<p class="text-center text-gray-600 dark:text-gray-300 mb-4">Please enter the verification code sent to your email:</p>
<form class="mt-4">
<input type="text" placeholder="Verification Code" class="w-full p-2 border border-gray-300 dark:border-gray-600 rounded-lg mb-6 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400" />
<button type="submit" class="w-full bg-blue-600 dark:bg-blue-500 text-white font-semibold py-2 rounded-lg shadow hover:bg-blue-700 dark:hover:bg-blue-400 transition duration-200 ease-in-out">Verify</button>
</form>
<div class="flex justify-between mt-6">
<a href="#" class="text-blue-600 dark:text-blue-400 hover:underline">Resend Code</a>
<a href="#" class="text-blue-600 dark:text-blue-400 hover:underline">Need Help?</a>
</div>
</div>
</div>Composants associés
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.
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs simple conçu avec le style glassmorphism, adapté aux plateformes de commerce électronique. Il dispose d’une palette de couleurs monochromatiques et est réactif avec la prise en charge du mode sombre.