Component
Navbar
Responsive navigation bar with built-in mobile hamburger menu.
Basic Usage
Navbar with brand, links, and actions
tsx
const links = [
{ key: "home", label: "Home", href: "#" },
{ key: "pricing", label: "Pricing", href: "#", active: true },
];
<Navbar
brand={<b>StarKit</b>}
links={links}
actions={<Button size="sm">Login</Button>}
shadow
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| brand | ReactNode | — | Brand logo or text on the left. |
| links | NavbarLink[] | [] | Navigation links (key, label, href, onClick, active). |
| actions | ReactNode | — | Action buttons on the right (shows in desktop and mobile menu). |
| sticky | boolean | false | Applies position: sticky to the navbar. |
| shadow | boolean | false | Adds a bottom hard shadow. |