Side Navigation

The Side Navigation is a left-aligned navigational component.

sidenav example


The sidenav is a familiar navigation pattern for users. The sidenav can fit as many navigation links as needed, scrolling when the content exceeds the viewport.

Use the sidenav:

  • For links secondary to the links in the header or subnav
  • For a navigation schema with a deep hierarchy
  • When the header and subnav cannot accommodate the required links
  • The sidenav works best in desktop applications.

See the application layout page to learn more Commure's layout guidance.

Grouping Links

If you group link names under a heading, don’t make the heading a link.

Using Icons

Include icons when you want to provide a more appealing visual look than just text.