Composant CAPTCHA - Brutalisme Vibrant Modéré
Un composant CAPTCHA brutaliste pour un tableau de bord aux couleurs vives et à la complexité modérée.
HTML Code
<div class="dark:bg-zinc-900 p-6 rounded-lg shadow-xl dark:shadow-none border-4 border-black dark:border-white">
<h2 class="text-2xl font-bold mb-4 text-black dark:text-white">Verify You Are Not a Robot</h2>
<div class="flex flex-col md:flex-row items-center space-y-4 md:space-y-0 md:space-x-4">
<div id="captcha-image" class="w-full md:w-1/2 h-32 bg-gray-300 dark:bg-zinc-700 flex items-center justify-center text-black dark:text-white text-4xl font-mono border-2 border-black dark:border-white">
<!-- CAPTCHA image or text will be generated here -->
<span class="select-none">Aj9pQ</span>
</div>
<div class="w-full md:w-1/2">
<label for="captcha-input" class="block text-sm font-medium text-black dark:text-white mb-2">Enter the text in the image:</label>
<input type="text" id="captcha-input" class="w-full px-4 py-2 border-2 border-black dark:border-white bg-white dark:bg-zinc-800 text-black dark:text-white focus:outline-none focus:ring-2 focus:ring-yellow-500">
</div>
</div>
<button class="mt-6 w-full bg-yellow-500 text-black dark:bg-yellow-600 dark:text-zinc-900 font-bold py-3 px-6 border-4 border-black dark:border-white hover:bg-yellow-600 dark:hover:bg-yellow-500 transition duration-300">
Submit
</button>
<button class="mt-4 w-full text-black dark:text-white font-bold py-3 px-6 border-4 border-black dark:border-white hover:bg-gray-200 dark:hover:bg-zinc-700 transition duration-300">
Refresh CAPTCHA
</button>
</div>
Composants associés
ArtDecoCaptchaComponent
Un composant CAPTCHA simple et réactif avec une esthétique Art Déco, utilisant des couleurs d’automne adaptées aux sites Web d’entreprise, avec prise en charge du mode sombre.
Composant CAPTCHA
Un composant CAPTCHA complexe et réactif avec un style de conception typographique suisse/international et une palette de couleurs vives, adapté aux outils CRM/Business. Inclut la prise en charge du mode sombre.
Composant CAPTCHA brutaliste
Un composant CAPTCHA brut et gras conçu avec une palette de couleurs en niveaux de gris, adapté à une interface de tableau de bord, y compris des fonctionnalités interactives pour la vérification de l’utilisateur.