Encabezado de negocio de diseño de materiales
Material Design inspiró un componente de encabezado simple con un esquema de color complementario para sitios web comerciales. Diseño responsivo con soporte para temas oscuros.
Código HTML
<header class="bg-blue-500 text-white py-4 shadow-md dark:bg-gray-800">
<div class="container mx-auto flex justify-between items-center">
<div class="text-xl font-bold">Business Name</div>
<nav>
<ul class="flex space-x-4">
<li><a href="#" class="hover:text-blue-200 dark:hover:text-gray-400">Home</a></li>
<li><a href="#" class="hover:text-blue-200 dark:hover:text-gray-400">About</a></li>
<li><a href="#" class="hover:text-blue-200 dark:hover:text-gray-400">Services</a></li>
<li><a href="#" class="hover:text-blue-200 dark:hover:text-gray-400">Contact</a></li>
</ul>
</nav>
</div>
</header>Componentes relacionados
Encabezado de diseño 3D
Un componente de encabezado receptivo con elementos de diseño 3D y compatibilidad con el modo oscuro.
Componente de encabezado
Un componente de encabezado responsivo diseñado en un estilo brutalista con un esquema de color pastel para un blog o sitio de contenido, que incorpora soporte para temas oscuros.
Componente de encabezado
Un componente de encabezado receptivo con un diseño retro / vintage, con soporte de tema oscuro y estética nostálgica de los años 80 / 90.