Volet Composantes sociales
Un composant de médias sociaux réactif avec prise en charge du mode sombre pour les sites Web d’entreprise, avec une palette de couleurs triadique.
HTML Code
<div class="dark:bg-gray-900 bg-teal-100 p-6 flex flex-col md:flex-row items-center justify-around">
<div class="dark:bg-gray-800 bg-teal-200 rounded-lg shadow-lg p-6 m-4 w-full md:w-1/3">
<h3 class="dark:text-white text-teal-900 text-xl font-semibold mb-4">Our Latest Post</h3>
<img src="https://picsum.photos/400/200" alt="Blog Post Image" class="rounded-md mb-4">
<p class="dark:text-gray-300 text-teal-800 mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<a href="#" class="dark:text-purple-400 text-blue-700 hover:underline">Read More</a>
</div>
<div class="dark:bg-gray-800 bg-red-200 rounded-lg shadow-lg p-6 m-4 w-full md:w-1/3">
<h3 class="dark:text-white text-red-900 text-xl font-semibold mb-4">Connect With Us</h3>
<div class="flex items-center mb-4">
<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar" class="w-10 h-10 rounded-full mr-4">
<p class="dark:text-gray-300 text-red-800">Follow us on Twitter!</p>
</div>
<button class="dark:bg-purple-600 bg-blue-600 text-white px-4 py-2 rounded-md hover:dark:bg-purple-700 hover:bg-blue-700">Follow</button>
</div>
<div class="dark:bg-gray-800 bg-orange-200 rounded-lg shadow-lg p-6 m-4 w-full md:w-1/3">
<h3 class="dark:text-white text-orange-900 text-xl font-semibold mb-4">Our Community</h3>
<ul class="list-disc list-inside dark:text-gray-300 text-orange-800">
<li>10K+ Members</li>
<li>Active Discussions</li>
<li>Exclusive Content</li>
</ul>
<a href="#" class="dark:text-purple-400 text-blue-700 hover:underline mt-4 block">Join Our Community</a>
</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 social de style brut présentant des éléments de portefeuille avec une palette de couleurs triadiques, parfait pour exposer du travail ou des produits.
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.