Componentes Componentes de medios Componente de componentes de medios

Componente de componentes de medios

Un componente multimedia responsivo inspirado en estilos de diseño retro/vintage, con una estética nostálgica de los años 80/90. Es compatible con el tema oscuro con Tailwind CSS e incluye imágenes de marcador de posición y avatares.

Vista previa

Código HTML

<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 max-w-sm mx-auto">
    <img class="rounded-lg w-full h-48 object-cover mb-4" src="https://picsum.photos/seed/media/400/200" alt="Media Thumbnail">
    <h2 class="text-2xl font-bold mb-2 text-gray-800 dark:text-gray-200">Retro Media Title</h2>
    <p class="text-gray-600 dark:text-gray-400 mb-4">This is a brief description of the media component, capturing the essence of the nostalgia from the 80s and 90s.</p>
    <div class="flex items-center">
        <img class="w-10 h-10 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
        <div>
            <p class="text-gray-800 dark:text-gray-200 font-semibold">User Name</p>
            <p class="text-gray-500 dark:text-gray-400 text-sm">Posted on March 1, 2023</p>
        </div>
    </div>
</div>

Componentes relacionados

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.

Abrir

Componente de Medios de Fotografía Artística

Un componente multimedia complejo y receptivo para portafolios de fotografía, con un estilo de diseño artístico/acuarela y una paleta de colores retro/vintage. Incluye múltiples elementos interactivos y soporte completo para el modo oscuro.

Abrir

Componente multimedia de skeuomorfismo

Componente multimedia inspirado en el skeuomorfismo que utiliza un esquema de color monocromático y un nivel de complejidad complejo, adaptado para fines de blog/contenido. Las características incluyen diseño responsivo y soporte de temas oscuros sin JavaScript.

Abrir