Composants Réinitialisation du mot de passe Composant de réinitialisation de mot de passe

Composant de réinitialisation de mot de passe

Un composant de réinitialisation de mot de passe dynamique de style 3D pour les blogs et la consommation de contenu. Il prend en charge le thème sombre et est riche en éléments interactifs.

Aperçu

HTML Code

<div class="flex flex-col items-center justify-center min-h-screen bg-gradient-to-br from-blue-500 to-purple-600 dark:from-blue-900 dark:to-purple-800 p-6 rounded-lg shadow-lg transform transition-all duration-300 ease-in-out hover:scale-105">
    <div class="max-w-md w-full bg-white dark:bg-gray-800 rounded-lg shadow-lg p-8">
        <h2 class="text-3xl font-semibold text-center text-blue-600 dark:text-blue-400">Reset Your Password</h2>
        <p class="text-center text-gray-600 dark:text-gray-300 mb-6">Enter your email address to receive a link to reset your password.</p>
        <form>
            <div class="mb-4">
                <label for="email" class="block text-sm font-medium text-gray-700 dark:text-gray-200">Email Address</label>
                <input type="email" id="email" required class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100" placeholder="[email protected]">
            </div>
            <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-400 text-white font-semibold py-2 px-4 rounded-md transition duration-200">Send Password Reset Link</button>
        </form>
        <div class="mt-4 text-center">
            <a href="#" class="text-blue-600 dark:text-blue-400 hover:underline">Go back to login</a>
        </div>
    </div>
    <div class="mt-6 flex justify-center">
        <img src="https://picsum.photos/60" alt="User Avatar" class="rounded-full border-4 border-white dark:border-gray-800">
    </div>
</div>

Composants associés

Retro_Crypto_Password_Reset_Component

Un composant complexe de réinitialisation de mot de passe sur le thème rétro/vintage conçu pour les applications de crypto-monnaie et de blockchain, avec une interaction en plusieurs étapes, une mise en page réactive et une prise en charge du mode sombre.

Ouvrir

Composant de réinitialisation de mot de passe

Composant de réinitialisation de mot de passe de conception minimaliste / plate avec des tons de terre, adapté aux plateformes immobilières. Il dispose d’une mise en page réactive, d’une prise en charge du mode sombre et de plusieurs champs de saisie pour une interface complexe.

Ouvrir

Composant de réinitialisation de mot de passe

Un composant de réinitialisation de mot de passe au design minimaliste et plat avec des tons de terre, un design réactif et une prise en charge du thème sombre, adapté au contenu du blog.

Ouvrir