Navigation Menu

A collection of links for navigating websites.

shadcn/ui docs →

Preview

Installation

terminal
$
Other package managers
bunx --bun shadcn@latest add https://trents.tech/r/navigation-menu.json

Dependencies: @radix-ui/react-navigation-menu

Usage

example.tsx
import {
  NavigationMenu,
  NavigationMenuContent,
  NavigationMenuItem,
  NavigationMenuLink,
  NavigationMenuList,
  NavigationMenuTrigger,
} from "@/components/ui/navigation-menu"

<NavigationMenu>
  <NavigationMenuList>
    <NavigationMenuItem>
      <NavigationMenuTrigger>Getting Started</NavigationMenuTrigger>
      <NavigationMenuContent>
        <div className="p-4 w-[400px]">
          <NavigationMenuLink href="/docs">
            Documentation
          </NavigationMenuLink>
        </div>
      </NavigationMenuContent>
    </NavigationMenuItem>
  </NavigationMenuList>
</NavigationMenu>
0