navtransparentintermediate

Transparent Navbar

A transparent navigation bar that overlays content with white links and a CTA button.

Preview

<nav class="absolute top-0 left-0 right-0 z-50 px-6 py-4">
  <div class="max-w-7xl mx-auto flex items-center justify-between">
    <a href="#" class="text-xl font-bold text-white">Brand</a>
    <div class="hidden md:flex items-center gap-8">
      <a href="#" class="text-white/80 hover:text-white transition-colors text-sm">Features</a>
      <a href="#" class="text-white/80 hover:text-white transition-colors text-sm">Pricing</a>
      <a href="#" class="text-white/80 hover:text-white transition-colors text-sm">About</a>
      <a href="#" class="px-4 py-2 bg-white/20 backdrop-blur-sm text-white text-sm font-medium rounded-lg border border-white/30 hover:bg-white/30 transition-all">Sign Up</a>
    </div>
  </div>
</nav>