Barra di navigazione in modalità scura
Componente della barra di navigazione con effetti reattivi e supporto per temi scuri.
Codice HTML
<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>
Componenti correlati
Neon_Glow_Navbar_Music_Audio
Un componente della barra di navigazione complesso e reattivo per piattaforme musicali/audio, con effetti neon/bagliore e una combinazione di colori neutri caldi. Include il supporto per la modalità oscura ed elementi interattivi.
Barra di navigazione del blog
Barra di navigazione reattiva con supporto della modalità oscura per siti Web di blog/contenuti. Presenta un design minimalista/piatto con una combinazione di colori pastello.
Barra di navigazione dei social media retrò/vintage
Barra di navigazione retrò / vintage per i social media con combinazione di colori analoga, complessità semplice, reattivo e supporto per temi scuri.