Componenti Accesso sociale Componente Social Login

Componente Social Login

Un componente di accesso social reattivo progettato per la modalità scura utilizzando una combinazione di colori monocromatica. Adatto per il consumo di blog e contenuti con funzionalità interattive.

Anteprima

Codice HTML

<div class="bg-gray-800 text-white p-6 rounded-lg shadow-lg max-w-md mx-auto mt-10">
    <h2 class="text-2xl font-bold mb-4 text-center">Log in with Social Media</h2>
    <div class="flex flex-col space-y-4">
        <a href="#" class="flex items-center justify-center bg-gray-700 hover:bg-gray-600 dark:bg-gray-900 dark:hover:bg-gray-800 text-white font-semibold py-2 rounded-lg shadow transition duration-200">
            <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-8 h-8 rounded-full mr-2">
            <span>Log in with Facebook</span>
        </a>
        <a href="#" class="flex items-center justify-center bg-gray-700 hover:bg-gray-600 dark:bg-gray-900 dark:hover:bg-gray-800 text-white font-semibold py-2 rounded-lg shadow transition duration-200">
            <img src="https://randomuser.me/api/portraits/women/1.jpg" alt="Avatar" class="w-8 h-8 rounded-full mr-2">
            <span>Log in with Google</span>
        </a>
        <a href="#" class="flex items-center justify-center bg-gray-700 hover:bg-gray-600 dark:bg-gray-900 dark:hover:bg-gray-800 text-white font-semibold py-2 rounded-lg shadow transition duration-200">
            <img src="https://randomuser.me/api/portraits/men/2.jpg" alt="Avatar" class="w-8 h-8 rounded-full mr-2">
            <span>Log in with Twitter</span>
        </a>
    </div>
    <p class="mt-4 text-center text-gray-400">Or, <a href="#" class="text-gray-300 hover:underline">create a new account</a></p>
</div>

Componenti correlati

Componente Art Deco Social Login

Un complesso componente di accesso social progettato con un'estetica Art Déco per CRM/Business Tools, con motivi geometrici, neutri caldi e reattività completa con supporto per la modalità oscura.

Aperto

Accesso social Brutalist (Moda/Bellezza)

Un componente di accesso sociale brutalista complesso e vibrante progettato per i marchi di moda e bellezza, caratterizzato da contrasto elevato, elementi audaci e piena reattività con supporto per la modalità oscura.

Aperto

Componente Social Login

Un componente di accesso social pulito e affidabile per siti Web di eventi e conferenze, con un tema sfumato multicolore e supporto per la modalità scura. Progettato per uso aziendale/professionale.

Aperto