Componenti CAPTCHA Componente CAPTCHA - Brutalismo Vibrante Moderato

Componente CAPTCHA - Brutalismo Vibrante Moderato

Un componente CAPTCHA brutalista per un cruscotto con colori vivaci e complessità moderata.

Anteprima

Codice HTML

<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>

Componenti correlati

Componente CAPTCHA

Un componente CAPTCHA in stile Glassmorphism con una combinazione di colori triadica, adatto per piattaforme di social media. Presenta elementi traslucidi simili al vetro smerigliato con effetti di sfocatura, con una complessità media e alcune funzioni interattive. Il design è reattivo e include il supporto per la modalità oscura.

Aperto

Componente CAPTCHA

Componente CAPTCHA reattivo con microinterazioni, supporto per temi scuri e immagini segnaposto casuali.

Aperto

Componente CAPTCHA complesso

Un componente CAPTCHA complesso per applicazioni di social media con modalità oscura e colori vivaci.

Aperto