navbar
Startup Minimal Navbar
Live Preview
<nav class="max-w-5xl mx-auto flex items-center justify-between px-6 py-6 bg-white">
<div class="w-10 h-10 bg-indigo-600 rounded-lg"></div>
<div class="flex items-center gap-8 text-slate-500 font-medium">
<a href="#" class="hover:text-black">Showcase</a>
<a href="#" class="hover:text-black">Template</a>
<a href="#" class="hover:text-black">Jobs</a>
</div>
<button class="bg-slate-950 text-white px-5 py-2 rounded-lg text-sm font-medium">Post a Job</button>
</nav>
<script>
document.querySelectorAll('button').forEach(btn => {
btn.addEventListener('mousedown', function () { this.classList.add('scale-95'); });
btn.addEventListener('mouseup', function () { this.classList.remove('scale-95'); });
});
</script>