Barra di navigazione dei social media
Glassmorphism Scala di grigi Semplice componente della barra di navigazione dei social media
Codice HTML
<nav class="p-4 bg-white bg-opacity-10 backdrop-filter backdrop-blur-lg dark:bg-gray-800 dark:bg-opacity-10 dark:backdrop-filter dark:backdrop-blur-lg">
<div class="container mx-auto flex justify-between items-center">
<div class="text-gray-800 dark:text-white text-xl font-bold">SocialApp</div>
<div class="flex space-x-4">
<a href="#" class="text-gray-800 dark:text-white hover:text-gray-600 dark:hover:text-gray-300">Feed</a>
<a href="#" class="text-gray-800 dark:text-white hover:text-gray-600 dark:hover:text-gray-300">Profile</a>
<a href="#" class="text-gray-800 dark:text-white hover:text-gray-600 dark:hover:text-gray-300">Messages</a>
</div>
</div>
</nav>
Componenti correlati
Componente della barra di navigazione
Una barra di navigazione responsive con microinterazioni coinvolgenti, progettata per l'e-commerce, utilizzando un tema scuro e colori color terra.
Barra di navigazione skeuomorphic
Un componente della barra di navigazione reattivo progettato in uno stile scheumorfico con supporto per temi scuri utilizzando Tailwind CSS.
Componente della barra di navigazione
Una barra di navigazione reattiva per un sito di e-commerce, con uno stile di design glassmorphism con una combinazione di colori in scala di grigi e supporto per la modalità scura utilizzando Tailwind CSS.