Composant d’intégration de média
Un composant multimédia d’intégration minimaliste conçu pour les tableaux de bord avec un design réactif et une prise en charge du thème sombre à l’aide de Tailwind CSS.
HTML Code
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-md p-4 max-w-xs mx-auto">
<div class="relative overflow-hidden rounded-lg">
<img src="https://picsum.photos/400/200" alt="Media" class="w-full h-48 object-cover rounded-lg">
</div>
<div class="mt-4">
<div class="flex items-center">
<img src="https://randomuser.me/api/portraits/men/10.jpg" alt="Avatar" class="w-10 h-10 rounded-full border-2 border-gray-500 dark:border-gray-300">
<div class="ml-4">
<h2 class="text-lg font-semibold dark:text-white">Media Title</h2>
<p class="text-gray-600 dark:text-gray-400">Short description of the media content goes here.</p>
</div>
</div>
<div class="mt-2">
<button class="bg-gray-800 text-white py-1 px-3 rounded hover:bg-gray-700 dark:bg-gray-300 dark:text-gray-800 dark:hover:bg-gray-400">Action Button</button>
</div>
</div>
</div>
Composants associés
Composant d’intégration de média
Un composant d’intégration multimédia réactif conçu avec le style Neumorphism dans Tailwind CSS, qui prend en charge le mode sombre.
Composant d’intégration de média
Un composant d’intégration multimédia de style Neumorphism adapté à la consommation de blogs et de contenus, doté d’une palette de couleurs triadique. Conception réactive avec prise en charge du mode sombre.
Composant d’intégration de média
Un composant d’intégration multimédia rétro/vintage conçu avec la nostalgie des années 80 et 90. Il dispose d’un style réactif et d’une prise en charge du mode sombre avec Tailwind CSS.