Navigation
<NavigationMenu>
  <NavigationMenuList>
    <NavigationMenuItem>
      <NavigationMenuTrigger>Products</NavigationMenuTrigger>
      <NavigationMenuContent>
        <ul className="grid w-[22rem] gap-1">
          <li>
            <NavigationMenuLink href="#">
              <span className="font-medium text-fg">Analytics</span>
              <span className="text-fg-tertiary">Real-time dashboards and reports.</span>
            </NavigationMenuLink>
          </li>
          <li>
            <NavigationMenuLink href="#">
              <span className="font-medium text-fg">Automations</span>
              <span className="text-fg-tertiary">Wire up rules and workflows.</span>
            </NavigationMenuLink>
          </li>
        </ul>
      </NavigationMenuContent>
    </NavigationMenuItem>
    <NavigationMenuItem>
      <NavigationMenuLink href="#" className={navigationMenuTriggerStyle()}>
        Docs
      </NavigationMenuLink>
    </NavigationMenuItem>
  </NavigationMenuList>
</NavigationMenu>
Navigation Menu

Import

Examples

Menu bar

Menu bar
