CCHub Logo CCHub Tailwind Collection
コンポーネント キャプチャ ダークモードCAPTCHAコンポーネント

ダークモードCAPTCHAコンポーネント

ダークモードUI用に設計されたCAPTCHAコンポーネントで、レスポンシブエフェクトとダークテーマのサポートを備えています。

プレビュー

HTMLコード 

<div class="bg-gray-800 text-white p-6 rounded-lg shadow-lg max-w-md mx-auto">
    <h2 class="text-lg font-semibold mb-4">Verify You're Human</h2>
    <div class="flex items-center mb-4">
        <img src="https://picsum.photos/50/50" alt="Random Image" class="w-12 h-12 rounded-full mr-3" />
        <span class="flex-1 text-sm">Please identify the image below:</span>
    </div>
    <div class="mb-4">
        <img src="https://picsum.photos/250/150" alt="CAPTCHA Image" class="w-full h-auto rounded-md" />
    </div>
    <div class="flex space-x-4">
        <button class="bg-blue-600 hover:bg-blue-500 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">Verify</button>
        <button class="bg-gray-500 hover:bg-gray-400 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">Refresh</button>
    </div>
</div>

関連コンポーネント

CAPTCHAコンポーネント

食品/レストランのWebサイト向けのシンプルでクリーンなモノスペースをテーマにしたCAPTCHAコンポーネントで、グレースケールの配色とダークモードのサポートによる完全な応答性が特徴です。

開ける

Glassmorphism_CAPTCHA_Component_Forest_Green

フォレストグリーンの配色を持つレスポンシブなglassmorphismスタイルのCAPTCHAコンポーネントで、製造/産業アプリケーションに適しています。ダークモードのサポートが含まれています。

開ける

Retro_Vintage_Captcha_Component

ビジネス/企業Webサイト向けのレトロ/ビンテージをテーマにしたCAPTCHAコンポーネントで、類似の配色、レスポンシブデザイン、ダークモードのサポートが特徴です。80年代/90年代の美学を呼び起こします。

開ける