Componente CAPTCHA
Un semplice componente CAPTCHA progettato con i principi del Material Design e una combinazione di colori pastello per siti Web aziendali/aziendali.
Codice HTML
<div class="max-w-md mx-auto p-5 bg-white dark:bg-gray-800 rounded-lg shadow-md">
<h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200 text-center">CAPTCHA Verification</h2>
<div class="mt-4 flex flex-col items-center">
<img src="https://picsum.photos/200/100" alt="CAPTCHA Image" class="w-full h-auto rounded-lg shadow">
<div class="mt-3 flex items-center">
<label class="text-gray-600 dark:text-gray-400 mr-2" for="captchaInput">Please type the text above:</label>
<input type="text" id="captchaInput" class="border border-gray-300 rounded-lg p-2 dark:bg-gray-700 dark:border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400" placeholder="Enter CAPTCHA">
</div>
<button class="mt-4 bg-blue-500 hover:bg-blue-600 text-white font-semibold py-2 px-4 rounded-lg shadow-md transition duration-200 ease-in-out dark:bg-blue-700 dark:hover:bg-blue-600">Verify</button>
</div>
</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.
Componente CAPTCHA di progettazione dei materiali
Un componente CAPTCHA reattivo con i principi del Material Design, incluso il supporto del tema scuro.
Componente CAPTCHA
Un componente CAPTCHA dal design minimalista/piatto per la presentazione del portfolio, reattivo con supporto per la modalità oscura.