Bottom Navbars

Bottom navigation bars allow movement between primary destinations in an app.

Bottom Navbar Example


Bottom navigation bar allows movement between primary destinations in an app. It is fixed to the bottom of screens for convenient access. Each destination should be represented by an icon, ideally with a label.


Use when

  • Needing navigation for top-level destinations accessible from anywhere in the app.
  • You have three to five destinations.

Don’t use when

  • There are fewer than three destinations. Instead use Tabs.
  • You need users to navigate to a single task.
  • You need to navigate to user preferences or settings.
What's changed
01/16/20231.0.0New component added.D. Bedick, E. Bohn, N. Cadsawan, E. Gunther, J. A. Provin Silva, L. Saenz, C. Starbird, R. Stillwell, S. Kaukonen, N. Byati