Site header
A responsive site header with a brand link, primary links with one level of dropdowns, a call to action, optional actions and a small-screen drawer.
- Section
- No additional dependencies
- Dark mode
Headers and website navigation
Headers, menus and breadcrumbs that help visitors find their way around a site.
Category: Navigation
Components
5 components
Announcement bar
A thin band above the site header with one short message, an optional badge and link, an optional dismiss button remembered per message id, and an expiry the server can decide.
- Section
- No additional dependencies
Mobile navigation drawer
A Menu button that opens a native modal drawer: large primary links, smaller secondary links and one call to action pinned to the foot, with focus handling, scroll lock and close on link.
- Control
- No additional dependencies
Primary navigation
A horizontal row of a website's main destinations with a current-page bar or pill, and a More disclosure that collects the trailing items that do not fit.
- Control
- No additional dependencies
- Dark mode
Dropdown navigation
A row of top-level links where some items are buttons that open a compact panel of related links, with optional one-line descriptions, an overview link for the section's own page and a footer shelf.
- Control
- No additional dependencies
- Dark mode
