Composant de connexion/inscription 12
Un composant de connexion/inscription réactif conçu dans le style du mode sombre, utilisant Tailwind CSS pour le style.
HTML Code
<div class="min-h-screen flex items-center justify-center bg-gray-900 p-5">
<div class="bg-gray-800 rounded-lg shadow-lg p-6 w-full max-w-md">
<h2 class="text-2xl font-bold text-white text-center">Welcome</h2>
<p class="text-gray-400 text-center mb-6">Please login or signup to continue</p>
<div class="mb-4">
<label class="block text-gray-300 mb-1" for="email">Email</label>
<input class="w-full bg-gray-700 text-white rounded border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 p-2" type="email" id="email" placeholder="Enter your email" required />
</div>
<div class="mb-4">
<label class="block text-gray-300 mb-1" for="password">Password</label>
<input class="w-full bg-gray-700 text-white rounded border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 p-2" type="password" id="password" placeholder="Enter your password" required />
</div>
<button class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 rounded focus:outline-none focus:ring-2 focus:ring-blue-500">Login</button>
<div class="flex items-center justify-between my-4">
<hr class="w-1/4 border-gray-600">
<span class="text-gray-400">or</span>
<hr class="w-1/4 border-gray-600">
</div>
<button class="w-full bg-green-600 hover:bg-green-700 text-white font-bold py-2 rounded focus:outline-none focus:ring-2 focus:ring-green-500">Signup</button>
<p class="text-gray-400 text-center mt-4">Already have an account? <a href="#" class="text-blue-400">Login</a></p>
<p class="text-gray-400 text-center">Need an account? <a href="#" class="text-green-400">Signup</a></p>
</div>
</div>
Composants associés
Composant de connexion/inscription
Un composant complexe de connexion/inscription utilisant les principes de Material Design et une palette de couleurs monochromatique pour les sites Web d’entreprise et d’entreprise avec prise en charge du thème sombre.
Composant de connexion/inscription
Un composant de connexion/inscription réactif conçu dans le style Material Design avec prise en charge du thème sombre et palette de couleurs complémentaire, adapté aux interfaces de médias sociaux.
Composant de connexion/inscription
Un formulaire de connexion/inscription simple et réactif conçu pour les entreprises manufacturières/industrielles, avec une palette monochrome avec une couleur d’accentuation vive, des transitions dégradées et la prise en charge du mode sombre.