KB-205 · NAV/DOCK/PILL

Dock Pill Navbar

A floating pill dock moored top-center rather than spanning the page. The active page carries a seated dot; choosing another link sends the dot sliding along the pill on the snap spring via a shared layout id. On small screens the fold opens as a full sheet whose links land on the cascade.

KB-205 · NAV/DOCK/PILL

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/nav-dock-pill

Props

PropTypeDefaultDescription
brand / links / activeHrefReactNode · PillLink[] · stringIdentity, the link set, and the seated page.
cta / onCtastring · () => voidThe dock's one action; repeated inside the sheet.