Volet Composantes sociales
Un composant simple de médias sociaux utilisant Tailwind CSS et conçu selon les principes du Material Design. Il présente des couleurs vives et une prise en charge du mode sombre, ce qui le rend adapté aux interfaces de réseaux sociaux.
HTML Code
<div class="max-w-sm mx-auto bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden">
<img class="w-full h-48 object-cover" src="https://picsum.photos/400/200" alt="Social Media Image">
<div class="p-4">
<div class="flex items-center space-x-3">
<img class="w-10 h-10 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar">
<div>
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</h2>
<p class="text-gray-600 dark:text-gray-300">@johndoe</p>
</div>
</div>
<p class="mt-2 text-gray-600 dark:text-gray-300">This is a sample post demonstrating the vibrant and energetic design suitable for social media engagement.</p>
<div class="mt-4 flex justify-between">
<button class="px-4 py-2 text-white bg-blue-500 rounded hover:bg-blue-600 dark:bg-blue-600 dark:hover:bg-blue-700">Like</button>
<button class="px-4 py-2 text-white bg-green-500 rounded hover:bg-green-600 dark:bg-green-600 dark:hover:bg-green-700">Comment</button>
</div>
</div>
</div>Composants associés
Glassmorphism Carte sociale
Un composant de carte sociale glassmorphism simple et réactif avec des couleurs pastel et la prise en charge du mode sombre, adapté aux interfaces de tableau de bord.
Composantes sociales
Une section de composants sociaux conçue dans un style skeuomorphique, avec des effets réactifs et un support de thème sombre.
Volet Composantes sociales
Un composant simple de médias sociaux conçu avec le Skeuomorphisme et une palette de couleurs monochromatiques pour le contenu du blog. Il dispose d’une mise en page réactive et d’un support de thème sombre utilisant Tailwind CSS.