Composant de réinitialisation de mot de passe
Un composant de réinitialisation de mot de passe avec Material Design, des couleurs vives, une complexité modérée et un objectif de commerce électronique. Il est réactif et prend en charge le thème sombre en utilisant Tailwind CSS. Aucun JavaScript n’est inclus.
HTML Code
<div class="min-h-screen flex items-center justify-center bg-gray-100 dark:bg-gray-900">
<div class="max-w-md w-full p-6 bg-white dark:bg-gray-800 rounded-lg shadow-xl">
<h2 class="text-3xl font-bold text-center text-indigo-600 dark:text-indigo-400 mb-6">Reset Your Password</h2>
<p class="text-center text-gray-600 dark:text-gray-300 mb-8">Enter your email address and we'll send you a link to reset your password.</p>
<form>
<div class="mb-5">
<label for="email" class="block text-gray-700 dark:text-gray-200 text-sm font-medium mb-2">Email Address</label>
<input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 dark:border-gray-700 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 dark:focus:ring-indigo-400 bg-gray-50 dark:bg-gray-700 text-gray-900 dark:text-gray-100" placeholder="[email protected]">
</div>
<button type="submit" class="w-full bg-indigo-600 hover:bg-indigo-700 dark:bg-indigo-500 dark:hover:bg-indigo-600 text-white font-bold py-3 px-4 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 dark:focus:ring-indigo-400 transition duration-300">
Send Reset Link
</button>
</form>
<div class="mt-6 text-center">
<a href="#" class="text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-500 text-sm font-medium">Remember your password? Log In</a>
</div>
</div>
</div>Composants associés
Composant de réinitialisation de mot de passe
Composant de réinitialisation de mot de passe skeuomorphique pour les médias sociaux avec schéma de couleurs analogue et prise en charge du mode sombre.
Composant de réinitialisation de mot de passe
Un composant de réinitialisation de mot de passe minimaliste et réactif avec des tons crépuscules/chauds, adapté aux sites Web de restauration/restaurants, y compris la prise en charge du mode sombre.
Réinitialisation de mot de passe Composant brutalisme Complexe Tableau de bord analogue
Un composant de réinitialisation de mot de passe de style brutaliste pour un tableau de bord, doté d’une mise en page complexe, d’une palette de couleurs analogue, d’une réactivité et d’une prise en charge du mode sombre.