Hamburger button
User interface element

The hamburger button is a button, typically placed in a top corner of a graphical user interface. Its function is to toggle a menu (sometimes referred to as a hamburger menu) or navigation bar between being collapsed behind the button or displayed on the screen.
The icon which is associated with this button consists of typically three parallel horizontal bars (≡), although sometimes four (≣), known as the hamburger icon (sometimes called collapsed menu icon). It is intended to resemble the lines of text in a small printed menu. It is named after its unintentional resemblance to a hamburger.
01History
The icon was originally designed by Norm Cox as part of the user interface for the Xerox Star personal computer, introduced in 1981. Cox described the icon's creation, saying:
Its graphic design was meant to be very 'road sign' simple, functionally memorable, and mimic the look of the resulting displayed menu list. With so few pixels to work with, it had to be very distinct, yet simple. I think we only had 16×16 pixels to render the image. (or possibly 13×13 [...])
Cox said that he would joke to potential users that it was an "air vent" to keep the window cool.
In possibly its first use after the Xerox Star, the release of Windows 1.0 in 1985 contained a three-line icon in each window's control menu. It was short-lived, however, as this icon disappeared in Windows 2.0 in favor of a single horizontal line denoting the control menu. Windows 95 replaced the single line with the program's icon, and the three-line version would not return to Windows until a placement on the start menu of the one-year update of Windows 10.
Cox's icon saw a resurgence starting in 2009 stemming from the limited screen area available to mobile apps.

02Variants
The hamburger icon consists of three parallel horizontal lines, intended to resemble the lines of text in a small menu. To further reduce screen real-estate consumption it may be narrowed to three vertically stacked dots (). This has been called a kebab, meatball or falafel button, but still pops up a normal-looking menu. In the Microsoft Office 365 and Google online applications, a similar icon consisting of three rows of three squares ( ) pops up an array of icons instead of a menu, and is referred to as a waffle button.
Clicking or pressing these buttons results in a vertical menu being revealed, generally the same as a one-item menu or tab bar.
03Similar characters
The hamburger button is not a textual character, and is not encoded in Unicode. However, sometimes visually-similar textual characters are used by designers to create a hamburger button, such as the following:
Hamburger button
- U+2261 ≡ IDENTICAL TO
- U+2263 ≣ STRICTLY EQUIVALENT TO (used e.g. by the Wikipedia template Key press)
- U+11054 𑁔 BRAHMI NUMBER THREE
- U+2630 ☰ TRIGRAM FOR HEAVEN
Kebab button
- U+1392 ᎒ ETHIOPIC TONAL MARK RIKRIK
- U+205D ⁝ TRICOLON
- U+22EE ⋮ VERTICAL ELLIPSIS
- U+2D57 ⵗ TIFINAGH LETTER TUAREG YAGH
- U+FE19 ︙ PRESENTATION FORM FOR VERTICAL HORIZONTAL ELLIPSIS
Ellipsis button
- U+2026 … HORIZONTAL ELLIPSIS
- U+22EF ⋯ MIDLINE HORIZONTAL ELLIPSIS
Waffle button
- three of the kebab button characters in a row, such as ⁝⁝⁝
- U+25A6 ▦ SQUARE WITH ORTHOGONAL CROSSHATCH FILL
- U+130D1 𓃑 EGYPTIAN HIEROGLYPH D067H
04Reception
It has been argued that while the collapsed menu button is now commonplace, its functionality is not necessarily immediately obvious when first encountered; in particular, older users less familiar with modern iconography may find it confusing. The location of the hamburger menu icon also depends on the specific website or app.
The menu button may increase interaction cost compared to a menu bar, requiring extra clicks to retrieve the same information, albeit with the benefit of less space usage of the screen. It has also been argued that designers tend to overload these icons with too much hidden information.
Sources and credits
This article is adapted from the Wikipedia article “Hamburger button”, written by its contributors and licensed under CC BY-SA 4.0. Fathomly has changed the layout, removed citation markers, navigation and maintenance notices, and adjusted punctuation. This adapted version is shared under the same license. For references, see the original article.
Images, from Wikimedia Commons:
- Hamburger icon.svg by Timothy Miller, Public domain
- Editing Wikipedia mobile screenshot p 16, Penny Cyclopaedia with menu.png by Wikipedia editors, CC BY-SA 3.0
Fathomly is not affiliated with or endorsed by the Wikimedia Foundation. Spotted a problem? Tell us.