Monday, October 12, 20269:40 AMETLondon2:40 PMDubai5:40 PMTokyo10:40 PMSydney12:40 AMLos Angeles6:40 AM57°FNew YorkNewsletter

Off-Canvas Content

A slide-in panel for menus or extras.

On this page

A statement menu that grows from the button
An app-style menu for big catalogs
Bottom sheets and top panels
Every trigger, every look
A contact tab on every page

Northwind StudioBranding & web design

Demo menus link nowhere; brands, addresses and phone numbers are samples (UK numbers reserved for fiction).

FULL SCREEN

Full-screen panel with a circle reveal, big numbered links that fill with color on hover, and a photo beside the menu on large screens. Great for creative studios and portfolios.

Atelier NineInterior architecture

SHOP DRAWER

Drill-down submenus slide in with a Back row, so even three levels stay tidy on a phone. Search at the top, a promo card and a helpful link underneath.

Loom & Co.Online store

SHEETS & DROP-DOWNS

A phone-style bottom sheet with tiles for quick actions, and a frosted drop-down from the top for search with popular links.

Bottom sheet · tiles

Top panel · search

SIX HAMBURGERS

Each button below uses a different hamburger animation and opens a different panel theme and effect. Try them all.

Classic → XLeft · light · slide

SqueezeRight · dark · 3D reveal

SpinLeft · gradient · scale

ArrowRight · glass · blur in

Offset linesFull screen · photo · scale

Dot gridRight · light · circle reveal

FLOATING TAB

Look at the right edge of your screen: the “Contact us” tab stays there while you scroll and opens a gradient panel with contact details, socials and a booking button. No menu needed.