Componenti CAPTCHA Componente CAPTCHA Glassmorphism

Componente CAPTCHA Glassmorphism

Un semplice componente CAPTCHA con uno stile di progettazione glassmorphism. Ideale per i siti Web di e-commerce, presenta un effetto traslucido simile al vetro smerigliato, supporto per la modalità scura e una combinazione di colori in scala di grigi.

Anteprima

Codice HTML

<div class="flex justify-center items-center min-h-screen bg-gray-900 dark:bg-gray-800">
    <div class="bg-white dark:bg-gray-700 backdrop-blur-md bg-opacity-30 rounded-lg shadow-lg p-6 max-w-md w-full">
        <h2 class="text-center text-gray-800 dark:text-gray-200 text-2xl font-semibold mb-4">Please Verify You Are Human</h2>
        <p class="text-center text-gray-600 dark:text-gray-400 mb-6">To continue with your shopping, please complete the CAPTCHA below.</p>
        <div class="flex justify-center mb-4">
            <img src="https://picsum.photos/200/100" alt="CAPTCHA Image" class="rounded-lg shadow-md" />
        </div>
        <div class="flex justify-center items-center">
            <input type="text" placeholder="Enter text from image" class="border border-gray-300 dark:border-gray-600 rounded-md p-2 w-1/2 bg-transparent text-gray-900 dark:text-gray-100" />
            <button class="ml-2 bg-gray-800 dark:bg-gray-500 text-white rounded-md px-4 py-2 hover:bg-gray-700 dark:hover:bg-gray-400">Verify</button>
        </div>
        <div class="flex justify-center mt-4">
            <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar" class="rounded-full w-12 h-12 border-2 border-white dark:border-gray-700" />
        </div>
    </div>
</div>

Componenti correlati

Componente CAPTCHA - Progettazione di materiali per caramelle

Un componente CAPTCHA semplice e reattivo con un'estetica Material Design a tema caramella, adatto per siti Web di eventi e conferenze. Include il supporto per la modalità oscura.

Aperto

Componente CAPTCHA

Un componente CAPTCHA con un design in modalità oscura che utilizza Tailwind CSS. È reattivo e supporta temi scuri senza JavaScript, utilizzando solo CSS.

Aperto

Componente CAPTCHA vintage retrò

Un semplice componente CAPTCHA progettato con un'estetica retrò nostalgica, combinazione di colori vivaci, adatto per siti Web aziendali e aziendali, con supporto per la modalità oscura.

Aperto