The hamburger menu is the most common mobile navigation pattern - three horizontal lines that open a menu!
Why Use It?
- Space Saving: Hides menu on small screens
- Universal: Everyone recognizes it
- Clean Design: Keeps mobile layout simple
- Desktop Friendly: Show full menu on larger screens
The Pattern
Mobile (< 768px)
- → Show hamburger icon
- → Hide full menu
- → Click to open menu
Desktop (≥ 768px)
- → Hide hamburger icon
- → Show full menu
- → Horizontal layout