Composant Composants d’affichage de contenu
Un composant d’affichage de contenu réactif conçu pour les sites Web d’entreprise/d’entreprise avec prise en charge du mode sombre et une palette de couleurs vives. Il comprend des sections pour les avatars des utilisateurs, le contenu textuel et les images.
HTML Code
<div class="bg-gray-900 text-white p-5 rounded-lg shadow-lg max-w-4xl mx-auto">
<h2 class="text-2xl font-bold mb-4">Our Team</h2>
<div class="grid md:grid-cols-2 gap-5">
<div class="bg-gray-800 p-4 rounded-lg transition-shadow duration-300 hover:shadow-xl">
<img class="w-full rounded-lg" src="https://picsum.photos/300/200" alt="Content Image">
<div class="flex items-center mt-2">
<img class="w-10 h-10 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar">
<div class="ml-3">
<p class="text-lg font-semibold">John Doe</p>
<p class="text-sm text-gray-400">CEO</p>
</div>
</div>
<p class="mt-2 text-gray-300">John is the visionary behind the company, driving innovation and strategies.</p>
</div>
<div class="bg-gray-800 p-4 rounded-lg transition-shadow duration-300 hover:shadow-xl">
<img class="w-full rounded-lg" src="https://picsum.photos/300/201" alt="Content Image">
<div class="flex items-center mt-2">
<img class="w-10 h-10 rounded-full" src="https://randomuser.me/api/portraits/women/1.jpg" alt="Avatar">
<div class="ml-3">
<p class="text-lg font-semibold">Jane Smith</p>
<p class="text-sm text-gray-400">CTO</p>
</div>
</div>
<p class="mt-2 text-gray-300">Jane oversees all technical aspects, ensuring seamless operations.</p>
</div>
</div>
<h2 class="text-2xl font-bold mt-10 mb-4">Company Achievements</h2>
<div class="bg-gray-800 p-4 rounded-lg transition-shadow duration-300 hover:shadow-xl">
<ul class="list-disc list-inside">
<li class="mt-2 text-gray-300">Awarded "Best Startup of the Year".</li>
<li class="mt-2 text-gray-300">Reached over 10,000 active users in under a year.</li>
<li class="mt-2 text-gray-300">Secured $1 million in funding.</li>
</ul>
</div>
</div>Composants associés
Composant Composants d’affichage de contenu
Un composant d’affichage de contenu simple et dynamique avec des micro-interactions, un design réactif et une prise en charge du thème sombre, adapté aux blogs et à la consommation de contenu. Utilise picsum.photos pour les images et randomuser.me pour les avatars.
Composant d’affichage du contenu
Un composant d’affichage de contenu conçu dans un style skeuomorphe pour le commerce électronique avec un thème sombre. Il présente des produits avec un minimum d’éléments, en utilisant une palette de couleurs analogue pour une esthétique agréable.
Composant d’affichage du contenu
Un composant d’affichage de contenu simple et réactif conçu dans un style brutaliste avec des couleurs complémentaires. Convient aux sites Web d’entreprise / d’entreprise, prenant en charge le mode sombre.