Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs simple et réactif conçu dans un style rétro avec des tons de terre, adapté aux interfaces de médias sociaux.
HTML Code
<div class="max-w-md mx-auto bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 mt-10">
<h2 class="text-center text-2xl font-bold text-brown-700 dark:text-brown-300 mb-4">Two-Factor Authentication</h2>
<p class="text-gray-700 dark:text-gray-300 text-center mb-6">Secure your account with an extra layer of security.</p>
<div class="flex justify-center mb-4">
<img src="https://picsum.photos/100/100" alt="Auth Image" class="rounded-full shadow-md">
</div>
<div class="mb-4">
<label class="block text-gray-700 dark:text-gray-300 mb-2" for="auth-code">Authentication Code</label>
<input type="text" id="auth-code" placeholder="Enter your code" class="w-full p-2 border border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-gray-200">
</div>
<div class="flex justify-center">
<button class="bg-brown-600 text-white font-bold py-2 px-4 rounded hover:bg-brown-500 dark:bg-brown-400 dark:hover:bg-brown-300">Verify</button>
</div>
</div>Composants associés
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs simple avec l’esthétique de Material Design, une palette de couleurs analogue et une prise en charge réactive du thème sombre.
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs conçu avec un style skeuomorphique, adapté aux applications de commerce électronique, utilisant un schéma de couleurs en niveaux de gris et des éléments interactifs complexes. Il présente un design réactif et une prise en charge du mode sombre à l’aide de Tailwind CSS.
Composant d’authentification à deux facteurs
Un composant d’authentification à deux facteurs (2FA) complexe et réactif conçu avec des dégradés de couleurs océan/bleu et des transitions fluides, adapté aux sites d’information et aux médias. Comprend la prise en charge du mode sombre et une interface interactive riche.