App frame side navigation

At a glance, the app frame side navigation may look similar to the standard side navigation. However, its interaction model introduces key differences.

The app frame side navigation includes a collapsible menu that lets users hide or reveal labels.

The standard side navigation, on the other hand, is best suited for fixed layouts that support multiple visual styles, such as icon-only, text-only, or mixed. Note that the standard side navigation cannot collapse.

Flexible width

The width of the side navigation is flexible, so choose a width that works with the navigation items in your experience. Make the width generous enough so that it doesn't feel too condensed. Doing this will ensure that users won't confuse the side navigation with buttons or other controls.

Text overflow

When the navigation item text is too long for the horizontal space available, it wraps to form another line.