Navigation / The visual dictionary
Navigation rail.
A compact vertical strip for switching between primary destinations.
Also calledside railnav rail
01
UI illustrationSee it in context
02
What it is
A compact vertical strip for switching between primary destinations. Combine recognizable icons with labels and a strong selected state.
When to use it
Use it on medium-width layouts where a full sidebar would consume too much space.
Know the difference
A rail is narrower than a drawer and prioritizes a small set of destinations.
03
Across platforms
WebiPadOSAndroidmacOSWindowsLinux
Web · iPadOS · Android · macOS · Windows · Linux
Material rail patterns suit medium and expanded windows; other ecosystems may call similar structures side navigation.
04
Go to the source
Primary documentation for the pattern and its platform conventions.