In Web & Mobile Design
What is Off‑canvas Navigation?
Off‑canvas navigation is a pattern where the menu lives off‑screen and is revealed via an icon or edge gesture.
When to use Off‑canvas Navigation?
- To prioritize content on small screens
- To tuck away secondary or infrequently used navigationWhen not to use Off‑canvas Navigation?
- When primary tasks depend on the menu for discoverability
- When visibility and wayfinding are criticalWhat is the anatomy of Off‑canvas Navigation?
- Trigger: hamburger icon or edge gesture
- Overlay and focus trap
- Dismissal area and escape behavior