Components Navigation Components Retro Social Media Navigation

Retro Social Media Navigation

Responsive Navigation Component with Dark Mode for Social Media (Retro/Vintage, Earth Tones, Moderate Complexity)

Preview

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>

Related Components

Neon Glow Government Navigation

A responsive navigation component for government/public services with a neon glow, candy-sweet color scheme, and dark mode support. Features bright, glowing elements with vibrant lighting effects.

Open

Social Media Navigation

A clean, minimalist social media navigation component with a forest green palette, designed for responsive layouts and dark mode. Features a main navigation, user profile, and search.

Open

Neumorphism Navigation

A simple responsive navigation component with Neumorphism style for e-commerce.

Open