Composants multimédias
Un composant de style Neumorphism pour l’affichage multimédia avec un design réactif et une prise en charge du thème sombre.
HTML Code
<div class="flex flex-col items-center justify-center p-6 bg-white rounded-xl shadow-lg dark:bg-gray-800 dark:shadow-gray-900 hover:shadow-xl transition-shadow duration-300 ease-in-out">
<div class="mb-4">
<img src="https://picsum.photos/300/200" alt="Media" class="w-full h-auto rounded-lg shadow-md" />
</div>
<div class="flex items-center mb-2">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-10 h-10 rounded-full shadow-lg mr-2">
<h2 class="text-lg font-semibold dark:text-white">User Name</h2>
</div>
<p class="text-gray-700 dark:text-gray-300 text-center">
This is a description of the media content that is displayed above. It's designed with a soft UI style to enhance the visual appeal.
</p>
</div>Composants associés
Bauhaus_E-commerce_Media_Component
Un composant multimédia de commerce électronique réactif et fonctionnel avec un design monochrome inspiré du Bauhaus, une prise en charge du mode sombre, mettant l’accent sur les formes géométriques et une hiérarchie visuelle claire pour la présentation des produits.
Composant multimédia Skeuomorphism
Composant multimédia inspiré du skeuomorphisme utilisant un schéma de couleurs monochromatiques et un niveau de complexité complexe, adapté à des fins de blog/contenu. Les fonctionnalités incluent la conception réactive et la prise en charge du thème sombre sans JavaScript.
Composant Composants multimédias
Un composant multimédia pour le commerce électronique avec des micro-interactions, une palette de couleurs en niveaux de gris, une complexité modérée, un design réactif et une prise en charge des thèmes sombres.