Components CAPTCHA CAPTCHA Component

CAPTCHA Component

A CAPTCHA component with a dark mode design using Tailwind CSS. It is responsive and supports dark themes without JavaScript, using only CSS.

Preview

HTML Code

<div class="flex items-center justify-center h-screen bg-gray-900">
  <div class="bg-gray-800 p-6 rounded-md shadow-md">
    <h2 class="text-xl font-semibold mb-4 text-white">CAPTCHA Verification</h2>
    <div class="mb-4">
      <img src="https://picsum.photos/200/60?random=1" alt="CAPTCHA Image" class="rounded-md">
    </div>
    <input type="text" class="w-full px-3 py-2 border border-gray-700 rounded-md bg-gray-900 text-white placeholder-gray-500 focus:outline-none focus:ring-blue-500 focus:border-blue-500" placeholder="Enter CAPTCHA">
    <button class="mt-4 w-full bg-blue-600 text-white py-2 px-4 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50">Verify</button>
  </div>
</div>

Related Components

Bauhaus CAPTCHA Component

A simple, functional CAPTCHA component in Bauhaus style for documentation/wiki sites, featuring geometric forms, high contrast, full responsiveness, and dark mode support.

Open

Luxury_Premium_CAPTCHA_Weather_Component

A complex, luxury-themed CAPTCHA component for weather/climate applications, featuring cool neutral colors, sophisticated typography, and responsive design with dark mode support. It includes elements like a visual challenge, a 'Current Weather' display, and a 'Climate Data' section.

Open

Complex CAPTCHA Component

A complex CAPTCHA component for social media applications with dark mode and vibrant colors.

Open