Navigation / The visual dictionary

Hamburger menu button.

A three-line icon that opens a navigation menu.

Also calledmenu iconthree-line menu

See it in context

UI illustration

What it is

A three-line icon that opens a navigation menu. Give it an accessible menu label and reveal a clearly structured destination list.

When to use it

Use it when primary navigation is hidden to save space.

Know the difference

The hamburger is the opener; the navigation drawer is the panel it reveals.

Across platforms

WebiOSiPadOSAndroidmacOSWindowsLinux

Web · iOS · iPadOS · Android · macOS · Windows · Linux

Drawer openers are common on web and Android; use native alternatives when a platform favors visible tabs or sidebars.

Go to the source

Primary documentation for the pattern and its platform conventions.

Material Design — Understanding navigation

FROM NAME TO NEXT BUILD

Put it into words.

Choose a device and an effect, then copy the whole description.

Building forPhone modelAnimation effectBrowse the effect library

Create a hamburger menu button. Give it an accessible menu label and reveal a clearly structured destination list. Use it when primary navigation is hidden to save space. Make it responsive and accessible, and follow the selected platform's interaction conventions.

Your copied description includes the component, device context, and selected animation timing.

See it in context

What it is

When to use it

Know the difference

Across platforms

Web · iOS · iPadOS · Android · macOS · Windows · Linux

Go to the source

You might also mean…

Navigation drawer

Sidebar

Overflow menu