DarkTriadicSimpleBusinessHeader
Composant d’en-tête réactif avec prise en charge du mode sombre pour les sites Web d’entreprise
HTML Code
<header class="bg-gray-900 text-gray-300 dark:bg-gray-dark dark:text-gray-light shadow-md">
<div class="container mx-auto px-6 py-4">
<div class="flex items-center justify-between">
<div class="text-xl font-bold text-white dark:text-white">Business Name</div>
<nav class="space-x-4">
<a href="#" class="hover:text-white dark:hover:text-white">Home</a>
<a href="#" class="hover:text-white dark:hover:text-white">About</a>
<a href="#" class="hover:text-white dark:hover:text-white">Services</a>
<a href="#" class="hover:text-white dark:hover:text-white">Contact</a>
</nav>
</div>
</div>
</header>
Composants associés
Composant d’en-tête
Un composant d’en-tête simple et réactif pour les réseaux sociaux, avec prise en charge du mode sombre. Il comporte un logo, une barre de recherche et un avatar de l’utilisateur. Utilise un jeu de couleurs en niveaux de gris.
Composant d’en-tête de commerce électronique
Un composant d’en-tête d’e-commerce réactif construit à l’aide de Tailwind CSS avec les principes de Material Design. Dispose d’une palette de couleurs monochromatiques (nuances de bleu), d’une fonctionnalité de recherche, d’un menu de navigation, d’un panier d’achat et d’un profil utilisateur. L’en-tête comprend des effets de profondeur tels que des ombres et prend en charge le mode sombre. Le composant est entièrement réactif avec un menu de hamburgers mobile.
En-tête de tableau de bord complexe
Un composant d’en-tête complexe et réactif avec des éléments de conception 3D, une palette de couleurs de terre, conçu pour les tableaux de bord. Inclut la prise en charge du thème sombre à l’aide de Tailwind CSS et utilise picsum.photos et randomuser.me pour les images de démonstration/avatars.