Pill Navbar

A fixed, rounded pill-shaped navigation bar with a logo, desktop menu links, sign-in/get-started buttons, and a slide-out sheet menu for mobile.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Pill Navbar to your project and fits it to your theme.

import Navbar from "@/components/ui/navbar-04";

export default function Demo() {
  return (
    <div className="relative h-screen w-full">
      <Navbar />
    </div>
  );
}