Composantes sociales
Un composant Web présentant un design glassmorphism avec des éléments translucides et des effets de flou semblables à du verre dépoli, des effets réactifs et la prise en charge du thème sombre.
HTML Code
<div class="flex justify-center items-center min-h-screen bg-gray-100 dark:bg-gray-900 transition-colors duration-500">
<div class="bg-white dark:bg-gray-800 bg-opacity-60 dark:bg-opacity-80 backdrop-blur-md rounded-lg shadow-lg p-6 max-w-lg w-full">
<h2 class="text-2xl font-bold text-gray-800 dark:text-white mb-4 text-center">Connect with Us</h2>
<div class="flex items-center justify-around flex-wrap mb-4">
<div class="flex flex-col items-center">
<img src="https://picsum.photos/80/80?random=1" alt="User Avatar" class="rounded-full mb-2">
<p class="text-gray-800 dark:text-white">User 1</p>
<a href="#" class="text-blue-500 hover:underline">Follow</a>
</div>
<div class="flex flex-col items-center">
<img src="https://picsum.photos/80/80?random=2" alt="User Avatar" class="rounded-full mb-2">
<p class="text-gray-800 dark:text-white">User 2</p>
<a href="#" class="text-blue-500 hover:underline">Follow</a>
</div>
<div class="flex flex-col items-center">
<img src="https://picsum.photos/80/80?random=3" alt="User Avatar" class="rounded-full mb-2">
<p class="text-gray-800 dark:text-white">User 3</p>
<a href="#" class="text-blue-500 hover:underline">Follow</a>
</div>
</div>
<div class="text-center">
<button class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 transition duration-300">View More</button>
</div>
</div>
</div>Composants associés
Volet Composantes sociales
Un composant de médias sociaux conçu pour un portfolio, avec un design réactif et une prise en charge du thème sombre à l’aide de Tailwind CSS. Il comprend des espaces réservés pour les avatars et les noms des utilisateurs.
Volet Composantes sociales
Un composant de médias sociaux rétro/vintage avec une mise en page simple et une palette de couleurs complémentaire. Prend en charge le mode sombre et est réactif.
Volet Composantes sociales
Un composant de médias sociaux réactif conçu avec une esthétique rétro/vintage, doté d’une interface riche avec de multiples éléments interactifs et un thème sombre.