Retro Social Media Navigation
Responsive Navigation Component with Dark Mode for Social Media (Retro/Vintage, Earth Tones, Moderate Complexity)
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.
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.
Neumorphism Navigation
A simple responsive navigation component with Neumorphism style for e-commerce.