Studiov0.6.0

NavBar

Tier 1 — shadcn
Navigation

A horizontal navigation bar with NavBarLink children for top-level page navigation.

Live Preview

Code

import { NavBar } from "@regen/ui";

<NavBar />

Props Inspector

No configurable props for this component.

Documentation

Use Cases

  • •App top navigation
  • •Section navigation bars
  • •Horizontal menu strips

Do

  • ✓Use NavBarLink for each navigation item
  • ✓Highlight the active link with data-active

Don't

  • ✗Don't nest NavBar inside another NavBar
  • ✗Don't use for sidebar navigation — use SidebarNav