Navigation Drawers

The navigation drawer slides in from the left. It is a common pattern found in Google apps and sites.



The navigation drawer on the left is a live demo of a permanent navigation drawer. Permanent navigation drawers are always visible and pinned to the left edge.

N.B. Permanent navigation drawers are recommended for desktop, they will turn into temporary navigation drawers on mobile and tablets.


The navigation drawer on the right is a live demo of a temporary navigation drawer. Temporary navigation drawers can toggle open or closed. Closed by default, the drawer opens temporarily above all other content until a section is selected.