CCHub Logo CCHub Tailwind Collection
Komponenten Navigations-Komponenten Retro Social Media Navigation

Retro Social Media Navigation

Responsive Navigationskomponente mit Dark Mode für Social Media (Retro/Vintage, Erdtöne, moderate Komplexität)

Vorschau

HTML-Code 

<nav class="bg-stone-200 dark:bg-stone-800 p-4">
  <div class="container mx-auto flex items-center justify-between">
    <div class="text-xl font-bold text-stone-800 dark:text-stone-200">SocialApp</div>
    <ul class="flex space-x-4">
      <li><a href="#" class="text-stone-600 dark:text-stone-400 hover:text-stone-800 dark:hover:text-stone-200">Feed</a></li>
      <li><a href="#" class="text-stone-600 dark:text-stone-400 hover:text-stone-800 dark:hover:text-stone-200">Profile</a></li>
      <li><a href="#" class="text-stone-600 dark:text-stone-400 hover:text-stone-800 dark:hover:text-stone-200">Messages</a></li>
      <li><a href="#" class="text-stone-600 dark:text-stone-400 hover:text-stone-800 dark:hover:text-stone-200">Settings</a></li>
    </ul>
  </div>
</nav>

Verwandte Komponenten

Brutalistische Navigationskomponente

Eine brutalistische Navigationskomponente mit reaktionsschnellem Verhalten und Unterstützung für dunkle Themen.

Offen

Navigations-Komponenten

Eine minimalistische Navigationskomponente für eine E-Commerce-Website mit Logo, Suchleiste, Navigationslinks, Warenkorbsymbol und Benutzeravatar mit Tailwind CSS. Diese Komponente unterstützt responsives Design und den Dunkelmodus.

Offen

Skeuomorphe Navigationskomponente

Eine Navigationskomponente im skeuomorphen Stil mit einem komplementären Farbschema, das für ein Dashboard mit Datenvisualisierung und Bedienfeldern geeignet ist. Es enthält interaktive Elemente für die Benutzerbindung.

Offen