Composant du formulaire d’inscription
Un formulaire d’inscription simple avec un design pastel 3D, réactif et avec prise en charge du mode sombre. Convient pour un blog ou un site de consommation de contenu.
HTML Code
<div class="min-h-screen bg-pastel-light dark:bg-pastel-dark flex items-center justify-center">
<div class="bg-white dark:bg-gray-700 p-8 rounded-lg shadow-2xl w-full max-w-md">
<h2 class="text-2xl font-bold text-gray-800 dark:text-white mb-6 text-center">Register</h2>
<form>
<div class="mb-4">
<label for="username" class="block text-gray-700 dark:text-gray-200 text-sm font-bold mb-2">Username</label>
<input type="text" id="username" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline dark:bg-gray-600 dark:text-white dark:border-gray-500" placeholder="Username">
</div>
<div class="mb-4">
<label for="email" class="block text-gray-700 dark:text-gray-200 text-sm font-bold mb-2">Email</label>
<input type="email" id="email" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline dark:bg-gray-600 dark:text-white dark:border-gray-500" placeholder="Email">
</div>
<div class="mb-6">
<label for="password" class="block text-gray-700 dark:text-gray-200 text-sm font-bold mb-2">Password</label>
<input type="password" id="password" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline dark:bg-gray-600 dark:text-white dark:border-gray-500" placeholder="********">
</div>
<div class="flex items-center justify-between">
<button class="bg-pastel-accent hover:bg-pastel-accent-dark text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline dark:bg-pastel-accent light:hover:bg-pastel-accent-dark" type="button">
Register
</button>
</div>
</form>
</div>
</div>Composants associés
Formulaire d’inscription Art Déco
Un composant de formulaire d’inscription réactif avec une esthétique Art déco, une palette de couleurs à contraste élevé et une prise en charge du mode sombre, adapté aux sites Web gouvernementaux ou de services publics.
Composant du formulaire d’inscription
Un composant de formulaire d’inscription avec une conception Neumorphism, une palette de couleurs en niveaux de gris, une complexité modérée et une prise en charge réactive du thème sombre à l’aide de Tailwind CSS.
Composant du formulaire d’inscription
Un composant de formulaire d’inscription réactif avec un style de conception de neumorphisme et une palette de couleurs néon/électrique, prenant en charge le mode sombre. Conçu pour le conseil/les services.