Navigation Patterns

2 patterns — Site Header and Site Footer

Responsive navigation compositions for the top and bottom of pages, with menus, search, actions, and link groups.

Site Header

Full-featured site header with logo, navigation menu, command search, and responsive mobile sheet. Adapts from desktop to mobile with a hamburger trigger.

Components used

NavigationMenu

Button

Command

Sheet

Site Footer

Multi-column site footer with link groups, dividers, and copyright. Collapses gracefully to a single column on small screens.

Components used

Separator

NavigationMenu