Side navigation
<gcds-side-nav>

Also called: sidebar menu, lefthand nav, vertical navigation.

A side navigation is a vertical list of page links on the left side of the screen.

• GitHub
• Figma

Check out side navigation use cases to see if they fit the problem you’re solving for.

Problems side navigation solves

It’s optional to use side navigation in products for:

• Information architectures with 1-3 levels of navigation.
• Presenting a consistent navigation interface across pages.
• Organizing and displaying a product’s hierarchical structure.
• Enabling contextual navigation for a person using the product by displaying their current location within the product.

Related components

Top navigation for websites with up to 2 levels in their information architecture.