Encabezado de diseño 3D
Un componente de encabezado receptivo con elementos de diseño 3D y compatibilidad con el modo oscuro.
Código HTML
<header class="bg-white shadow-lg dark:bg-gray-800">
<div class="container mx-auto px-6 py-4">
<div class="flex items-center justify-between">
<div class="text-xl font-semibold text-gray-700 dark:text-white">3D Header</div>
<div class="hidden md:block">
<nav>
<a href="#" class="text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-white px-4">Home</a>
<a href="#" class="text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-white px-4">About</a>
<a href="#" class="text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-white px-4">Contact</a>
</nav>
</div>
</div>
</div>
</header>
Componentes relacionados
RetroHeaderComponent
Componente de encabezado retro / vintage con efectos receptivos y soporte para temas oscuros.
Cabecera de Redes Sociales
Un componente de encabezado receptivo para interfaces de redes sociales, diseñado con una interfaz de usuario de modo oscuro que utiliza un esquema de color triádico y elementos mínimos. Incluye un título del sitio, una barra de búsqueda y un enlace al perfil de usuario, con estilos adaptados para el modo oscuro utilizando Tailwind CSS.
Componente de encabezado
Un componente de encabezado receptivo con diseño de Glassmorphism con elementos translúcidos similares al vidrio esmerilado y soporte para temas oscuros.