Bottom navigation

A navigation bar fixed to the bottom of a phone screen, with 3–5 icons for the main sections.

Also called: bottom navigation, bottom nav, bottom bar, bottom menu, menu at the bottom, bar at the bottom, icons at the bottom, tab bar, tabbar, navbar, app navigation, buttons at the bottom of the app

What it is for

It puts the app’s top-level sections within easy reach of the thumb. The section you’re in is highlighted.

Where you see it

  • Social apps — switching between feed, search and profile
  • Finance apps — quick access to accounts, history, payments
  • E-commerce — catalog, favorites, cart with a badge, account

What it is called in code

  • <nav> at the bottom of the screen
  • bottom navigation / tab bar

See also

  • Hamburger menu — An icon of three horizontal lines that hides the main menu off-screen until you tap it.
  • Tabs — A row of labels above a block of content. Click one and the block shows that section.
  • Badge — A small pill or circle with a short word or number: “New”, “−20%”, “3”.