Designpedia
All terms
Navigation & Inputs · Navigation

Navigation Rail

also known as Nav rail, Side rail

A navigation rail is a compact vertical bar on the left edge that provides access to three to seven primary destinations, using icons with short labels. It suits tablets and desktop layouts where a bottom bar would be awkward to reach. It serves the same navigation role as bottom navigation but adapts to larger viewports.

See it live — shadcn/ui · MUI · Ant Design
Don't confuse it with
A navigation rail is a narrow, icon-first strip for a few top-level destinations; a sidebar (navigation drawer) is wider, shows full labels, and can hold many items and nested groups. Rails replace bottom navigation on wide screens.
In the wild
Gmail's left rail on desktop with Mail, Chat, Meet icons.
Tags
Sources