Composants Boutons OAuth Composant Boutons OAuth

Composant Boutons OAuth

Un composant Web pour les boutons d’authentification OAuth stylisé avec neumorphisme, conçu pour un portfolio, et comprend une mise en page réactive avec prise en charge du thème sombre.

Aperçu

HTML Code

<div class="flex flex-col items-center justify-center h-screen bg-gray-100 dark:bg-gray-900 p-4">
    <div class="p-6 bg-white rounded-xl shadow-lg dark:bg-gray-800 dark:shadow-gray-700">
        <h2 class="text-2xl font-semibold text-gray-800 dark:text-white mb-4">Connect with Us</h2>
        <div class="flex flex-col space-y-4">
            <a href="#" class="flex items-center justify-center p-4 bg-gray-200 dark:bg-gray-700 rounded-lg shadow-lg transition-transform transform hover:scale-105">
                <img src="https://picsum.photos/30?blur=1" alt="Google Logo" class="mr-3 rounded-full">
                <span class="text-gray-700 dark:text-white">Sign in with Google</span>
            </a>
            <a href="#" class="flex items-center justify-center p-4 bg-gray-200 dark:bg-gray-700 rounded-lg shadow-lg transition-transform transform hover:scale-105">
                <img src="https://picsum.photos/30?blur=1" alt="Facebook Logo" class="mr-3 rounded-full">
                <span class="text-gray-700 dark:text-white">Sign in with Facebook</span>
            </a>
            <a href="#" class="flex items-center justify-center p-4 bg-gray-200 dark:bg-gray-700 rounded-lg shadow-lg transition-transform transform hover:scale-105">
                <img src="https://picsum.photos/30?blur=1" alt="GitHub Logo" class="mr-3 rounded-full">
                <span class="text-gray-700 dark:text-white">Sign in with GitHub</span>
            </a>
        </div>
    </div>
</div>

Composants associés

Composant Boutons OAuth

Un ensemble de boutons OAuth conçus avec une esthétique brutaliste et Tailwind CSS, avec des effets réactifs et une prise en charge du thème sombre.

Ouvrir

Composant Boutons OAuth

Un composant de boutons OAuth réactif sur le thème sombre avec une palette de couleurs triadique et des éléments interactifs complexes pour les sites Web d’entreprise.

Ouvrir

Composant Boutons OAuth

Un composant de boutons OAuth réactif conçu avec des animations attrayantes et des couleurs de terre, adapté aux interfaces de médias sociaux et prenant en charge les thèmes sombres.

Ouvrir