Componente de medios minimalista
Un componente multimedia simple, limpio y receptivo para sitios web comerciales/corporativos, con colores dulces/dulces y soporte para modo oscuro.
Código HTML
<div class="p-4 sm:p-6 lg:p-8 bg-white dark:bg-gray-900 transition-colors duration-300">
<div class="max-w-md mx-auto bg-pink-100 dark:bg-gray-800 rounded-lg shadow-lg overflow-hidden md:max-w-2xl lg:max-w-4xl">
<div class="md:flex">
<div class="md:flex-shrink-0">
<img class="h-48 w-full object-cover md:w-48" src="https://picsum.photos/400/300?random=1" alt="Modern business workspace">
</div>
<div class="p-4 md:p-6">
<div class="uppercase tracking-wide text-sm text-pink-500 dark:text-pink-400 font-semibold">Company News</div>
<a href="#" class="block mt-1 text-lg leading-tight font-medium text-gray-900 dark:text-white hover:underline transition-colors duration-300">Innovative Solutions for Future Growth</a>
<p class="mt-2 text-gray-700 dark:text-gray-300 text-sm md:text-base">Our latest report highlights key strategies and technological advancements that are set to redefine industry standards. Discover how we're shaping tomorrow's landscape.</p>
<div class="mt-4 flex items-center">
<div class="flex-shrink-0">
<img class="h-8 w-8 rounded-full object-cover" src="https://randomuser.me/api/portraits/women/6.jpg" alt="Author Avatar">
</div>
<div class="ml-3 text-sm text-gray-600 dark:text-gray-400">
<p class="font-medium">Jane Doe</p>
<p>CEO, Tech Innovations</p>
</div>
</div>
</div>
</div>
</div>
</div>Componentes relacionados
Componentes de medios
Un componente de estilo Neumorphism para la visualización de medios con diseño responsivo y compatibilidad con temas oscuros.
Industrial_Marketplace_Media_Component
Un componente de medios simple de estilo industrial para un mercado, con una imagen, un título y un precio, con un enfoque en las materias primas y la estética utilitaria. Utiliza colores otoñales y admite el modo oscuro.
Componente de medios análogos de la Bauhaus
Un componente multimedia responsivo con un diseño inspirado en la Bauhaus, que utiliza una combinación de colores análoga, adecuado para sitios web gubernamentales / de servicio público. Cuenta con formas geométricas, colores análogos primarios y compatibilidad con el modo oscuro.