Componente de restablecimiento de contraseña
Un componente minimalista de restablecimiento de contraseña con diseño responsivo y soporte de temas oscuros usando Tailwind CSS.
Código HTML
<div class="flex items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-800">
<div class="bg-white dark:bg-gray-900 shadow-md rounded-lg p-8 w-96">
<h2 class="text-2xl font-semibold text-gray-800 dark:text-gray-200 text-center">Reset Password</h2>
<p class="text-gray-600 dark:text-gray-400 text-center mb-6">Please enter your email address to receive a password reset link.</p>
<form>
<div class="mb-4">
<label class="block text-gray-700 dark:text-gray-300 mb-2" for="email">Email</label>
<input type="email" id="email" class="w-full p-2 border border-gray-300 dark:border-gray-600 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400" placeholder="[email protected]" required>
</div>
<button type="submit" class="w-full bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 rounded focus:outline-none focus:ring-2 focus:ring-blue-400 dark:focus:ring-blue-500">Send Reset Link</button>
</form>
<div class="mt-4 text-center">
<p class="text-gray-500 dark:text-gray-400">Remembered your password? <a href="#" class="text-blue-500 hover:underline">Login</a></p>
</div>
</div>
</div>
Componentes relacionados
Componente de restablecimiento de contraseña
Componente de restablecimiento de contraseña con diseño retro / vintage, combinación de colores de tonos tierra y nivel de complejidad complejo, para fines comerciales / corporativos, utilizando Tailwind CSS. Diseño responsivo con soporte para temas oscuros. No se necesita código JavaScript, solo HTML con clases Tailwind. Uso de picsum.photos para imágenes y randomuser.me para avatares.
Componente de restablecimiento de contraseña
Un componente de restablecimiento de contraseña receptivo con diseño de neumorfismo, compatibilidad con modo oscuro y sin JavaScript.
Skeuomórfico Pastel Restablecimiento de contraseña
Un componente web responsivo de restablecimiento de contraseña diseñado con una estética de skeuomorfismo, con suaves colores pastel. La interfaz es compleja, con múltiples elementos interactivos detallados a través de efectos 3D, sombras y texturas sutiles creadas con Tailwind CSS. Incluye un formulario para ingresar correo electrónico y un botón destacado 'Enviar enlace de restablecimiento', junto con enlaces secundarios. Se admite el tema oscuro. Ideal para exhibiciones de portafolios.