Wraps top-level navigation and branding.
When to use
- To offer top-level navigation and branding (such as a logo).
- To keep navigation in a consistent place throughout the app.
When not to use
- For more complicated or lower-level navigation—use a drawer.
- For navigation within a screen or links in an app footer— use tabs.
- For lists of navigation links (in or out of a navigation bar)—use a link list.
Vary items by context
On large screens, it can help to have full ideas written out. Use clear nouns to describe what each menu item means.
When using icons, keep them aligned to the side without large gaps in between.
Collapse menus in smaller contexts
Make sure users know how to open the items. Use common patterns like a menu icon to make it clear what’s possible.
Keep app bar clean
In mobile apps, the navigation bar can’t hold much. It’s not the right place to hold menus or other complicated options.
If you want to add links to options in an app, consider using a tab bar in the footer.