Barre de navigation en mode sombre
Composant de la barre de navigation avec effets réactifs et prise en charge du thème sombre.
HTML Code
<nav class="bg-gray-800 p-4 text-white">
<div class="container mx-auto flex items-center justify-between">
<div class="text-lg font-semibold">My Website</div>
<div class="hidden md:flex space-x-4">
<a href="#" class="hover:underline">Home</a>
<a href="#" class="hover:underline">About</a>
<a href="#" class="hover:underline">Services</a>
<a href="#" class="hover:underline">Contact</a>
</div>
<div class="md:hidden">
<button class="text-white focus:outline-none">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16m-4 6h4"></path>
</svg>
</button>
</div>
</div>
</nav>
Composants associés
Composant de la barre de navigation 47
Une barre de navigation réactive avec un style de conception 3D, incorporant de la profondeur et de l’engagement, prenant en charge le thème sombre.
Barre de navigation skeuomorphe
Composant de la barre de navigation du portfolio conçu avec des styles skeuomorphes et une palette de couleurs pastel, y compris la prise en charge du mode sombre. Il comporte des éléments interactifs tels que des liens et un menu déroulant.
Composant de la barre de navigation
Un composant de barre de navigation réactif conçu dans le style Material Design avec une palette de couleurs triadique, adapté aux interfaces de médias sociaux et incluant la prise en charge du thème sombre.