Navigation / The visual dictionary
Navigation bar.
A bar that identifies the current screen and provides navigation actions.
Also callednav bartop app bar
01
UI illustrationSee it in context
02
What it is
A bar that identifies the current screen and provides navigation actions. Show the screen title, a back action when applicable, and a small number of contextual actions.
When to use it
Use it to maintain orientation within a screen hierarchy.
Know the difference
A navigation bar moves through screens; a toolbar primarily exposes actions.
03
Across platforms
WebiOSiPadOSAndroidmacOSWindowsLinux
Web · iOS · iPadOS · Android · macOS · Windows · Linux
iOS navigation bars and Android top app bars have different native sizing and title conventions.
04
Go to the source
Primary documentation for the pattern and its platform conventions.