Intestazione SocialMedia
Un componente di intestazione reattivo per le interfacce dei social media, progettato con un'interfaccia utente in modalità oscura utilizzando una combinazione di colori triadica ed elementi minimi. Include un titolo del sito, una barra di ricerca e un link al profilo utente, con stili adattati per la modalità oscura utilizzando Tailwind CSS.
Codice HTML
<header class="bg-gray-900 text-gray-200 py-4 px-6 shadow-md">
<div class="container mx-auto flex flex-wrap items-center justify-between">
<div class="text-xl font-bold">SocialNet</div>
<div class="flex-grow mx-4 max-w-md">
<input type="text" placeholder="Search..." class="w-full px-3 py-2 bg-gray-800 text-gray-200 rounded-md focus:outline-none focus:ring focus:border-blue-300 dark:bg-gray-700 dark:text-gray-100 dark:focus:border-blue-600">
</div>
<nav>
<a href="#" class="px-3 py-2 hover:text-blue-400 dark:hover:text-blue-500">Profile</a>
</nav>
</div>
</header>Componenti correlati
Componente intestazione
Un componente di intestazione reattivo per una dashboard con microinterazioni e colori vivaci, che supporta il tema scuro.
RetroHeaderComponent
Componente Header retrò/vintage con effetti reattivi e supporto per temi scuri.
Componente intestazione
Un componente di intestazione reattivo con un design retrò/vintage, con supporto per temi scuri ed estetica nostalgica degli anni '80/'90.