Navbar
The floating clay pill from the landing page — sticky, rounded, and collapsible on mobile with an animated burger.
import { Navbar } from "marclayui";Non-sticky preview
Framework-agnostic: links render as plain
<a>, so the same markup works in Next.js, Remix or Vite. Highlight the active route yourself via activeHref.| Prop | Type | Default | Description |
|---|---|---|---|
brand | React.ReactNode | — | Brand slot, links to '/'. |
links | NavLinkItem[] | — | { href, label } items. |
activeHref | string | — | Href to highlight with the gradient pill. |
right | React.ReactNode | — | Right-side slot — theme toggle, CTAs, etc. |
sticky | boolean | true | Pins the bar 18px below the top while scrolling. |