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
Barre de navigation rétro/vintage pour les réseaux sociaux
Barre de navigation rétro/vintage pour les médias sociaux avec une palette de couleurs analogue, une complexité simple, une prise en charge réactive et un thème sombre.
Barre de navigation des médias sociaux
Glassmorphism Grayscale Composant simple de la barre de navigation des médias sociaux
Barre de navigation skeuomorphe
Un composant de barre de navigation réactif conçu dans un style skeuomorphe avec prise en charge du thème sombre à l’aide de Tailwind CSS.