Composant d’intégration multimédia 14
Un composant d’intégration multimédia conçu dans un style skeuomorphe, avec des effets réactifs et une prise en charge des thèmes sombres. Il comprend une image, une description et un avatar de l’utilisateur.
HTML Code
<div class="max-w-lg mx-auto bg-white dark:bg-gray-800 rounded-lg shadow-lg p-5 my-8"> <div class="relative"> <img src="https://picsum.photos/500/300" alt="Media Content" class="rounded-lg shadow-md"/> <div class="absolute top-0 left-0 bg-gray-900 bg-opacity-50 text-white rounded-lg p-2"> <span>Featured Media</span> </div> </div> <div class="mt-4"> <h2 class="text-lg font-bold text-gray-800 dark:text-white">Media Title</h2> <p class="text-gray-600 dark:text-gray-400">This is a brief description of the media content displayed above.</p> </div> <div class="flex items-center mt-4"> <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar" class="w-10 h-10 rounded-full border-2 border-white dark:border-gray-800 shadow-md"/> <div class="ml-3"> <p class="text-gray-800 dark:text-white font-semibold">John Doe</p> <p class="text-gray-600 dark:text-gray-400 text-sm">Media Creator</p> </div> </div></div>
Composants associés
Composant d’intégration multimédia - Tons de terre minimalistes
Un composant multimédia minimaliste pour les tableaux de bord, avec un design réactif et une prise en charge du thème sombre, en utilisant des tons de terre. Il affiche un lecteur vidéo, un titre, une description et des informations sur la chaîne.
Composant d’intégration de média
Un composant d’intégration multimédia réactif avec prise en charge des thèmes sombres, une mise en page complexe et une palette de couleurs complémentaire, conçu pour les tableaux de bord.
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.