Composant Formulaires 3D
Un composant de formulaires simple et réactif avec des éléments de conception 3D et des couleurs pastel pour les interfaces de médias sociaux, prenant en charge le mode sombre.
HTML Code
<div class="max-w-md mx-auto p-6 bg-white dark:bg-gray-800 rounded-lg shadow-lg transform transition-transform hover:scale-105">
<h2 class="text-2xl font-bold text-gray-800 dark:text-gray-200 mb-4">Join Our Community</h2>
<form>
<div class="mb-4">
<label class="block text-gray-700 dark:text-gray-300 mb-2" for="name">Name</label>
<input type="text" id="name" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 dark:text-gray-300 dark:bg-gray-700 focus:outline-none focus:shadow-outline" placeholder="Enter your name">
</div>
<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="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 dark:text-gray-300 dark:bg-gray-700 focus:outline-none focus:shadow-outline" placeholder="Enter your email">
</div>
<div class="mb-4">
<label class="block text-gray-700 dark:text-gray-300 mb-2" for="avatar">Upload Avatar</label>
<input type="file" id="avatar" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 dark:text-gray-300 dark:bg-gray-700 focus:outline-none focus:shadow-outline">
</div>
<div>
<button type="submit" class="w-full bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Join</button>
</div>
</form>
<div class="mt-4">
<img src="https://picsum.photos/200" alt="Random Design" class="rounded-md shadow-lg mt-3 w-full">
</div>
</div>Composants associés
Composant Formulaires
Un composant de formulaires réactifs conçu dans un style minimaliste, adapté aux interfaces de médias sociaux, avec des couleurs vives, une prise en charge du mode sombre et des interactions complexes.
Neumorphic_Fashion_Form
Un composant de forme neumorphe complexe, réactif et avec une palette de couleurs sourdes/désaturées, conçu pour les marques de mode et de beauté, avec plusieurs éléments interactifs et la prise en charge du mode sombre.
Photography_Contact_Form
Un formulaire de contact épuré et minimaliste pour les portfolios de photographie, inspiré de la typographie suisse/internationale, avec une palette de couleurs rétro/vintage discrète. Entièrement réactif avec prise en charge du mode sombre.