Off-canvas
A layout pattern where content lives outside the visible viewport and slides in on demand.
Off-canvas content is hidden beyond an edge of the screen and revealed by a trigger or gesture — usually navigation that slides in from the left or right. The pattern is responsive-friendly: full menus collapse off-screen on mobile, then return inline on wider viewports. A drawer is a common off-canvas component.
Also called
off-canvas menuoff-screen menu
When to use
- Mobile navigation that would crowd the screen if shown inline
- Secondary content that's accessed occasionally (filters, settings)
When not to use
- Primary content the user needs to see by default
- Wide screens where the content has room to live inline
Related
Source
Web vernacular; popularized by Luke Wroblewski and the responsive web design community around 2012-2013.