Navigation Menu
Navigation menus are calm triggers with a clear overlay surface. Use popupShadow to tune the popup depth (default is the smaller shadow).
Popup Shadow Variants
Two shadow sizes for the popup surface (viewport). Use default for most menus, and elevated when the popup must read as the main object.
Default (shadow-paper-sm)
Elevated (shadow-paper-md)
Pills Style
Each item appears as an individual pill with Paper Cut shadow effects.
API Reference
NavigationMenu is built on Radix UI Navigation Menu, with Paper Cut sizing and popup shadow variants.
NavigationMenu
PropTypeDescription
viewportbooleanUse viewport-based animations (default: true)popupShadow"default" | "elevated"Popup shadow size (default is smaller)NavigationMenuList
PropTypeDescription
variant"default" | "pills" | "minimal" | "filled" | "elevated"Menu bar styling (use sparingly)NavigationMenuTrigger
PropTypeDescription
variant"default" | "filled" | "pill" | "underline"Trigger visual style