Componente de visualización de contenido
Un componente de visualización de contenido simple y receptivo diseñado en un estilo brutalista con colores complementarios. Adecuado para sitios web comerciales / corporativos, compatible con el modo oscuro.
Código HTML
<div class="bg-white dark:bg-gray-800 text-black dark:text-white border border-black dark:border-white p-6 max-w-lg mx-auto">
<h1 class="text-3xl font-bold mb-4">Company Title</h1>
<img src="https://picsum.photos/500/300" alt="Content Image" class="w-full rounded-lg mb-4">
<p class="text-lg mb-6">This is a brief description of the company. Emphasizing clear, bold statements to convey professionalism and competence in a raw form.</p>
<div class="flex items-center">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-12 h-12 rounded-full mr-3">
<div class="">
<h2 class="text-xl font-semibold">John Doe</h2>
<p class="text-gray-600 dark:text-gray-400">CEO</p>
</div>
</div>
</div>Componentes relacionados
Componente Componentes de visualización de contenido
Componente de visualización de contenido de Glassmorphism con tonos tierra
Tarjeta postal retro para redes sociales
Un componente de postal de redes sociales receptivo con una estética retro / vintage de los 80 / 90, que utiliza un esquema de color análogo (cielo, verde azulado, morado) con acentos fucsia. Cuenta con soporte para modo oscuro y efectos interactivos de desplazamiento. El contenido incluye el avatar del usuario, el nombre de usuario, la marca de tiempo, la publicación de texto, la imagen y los botones de acción (me gusta, comentar, compartir). Construido con Tailwind CSS.
SimpleContentDisplay
Un componente de visualización de contenido simple con diseño receptivo y soporte de tema oscuro usando Tailwind CSS.