Navigation / The visual dictionary
Vertical tabs.
A tab list arranged in a column beside its associated content.
Also calledside tabsvertical tab list
01
UI illustrationSee it in context
02
What it is
A tab list arranged in a column beside its associated content. Keep labels readable, mark the selected tab, and connect each tab to the corresponding panel.
When to use it
Use it for peer sections when horizontal space or label length makes top tabs awkward.
Know the difference
Vertical tabs switch peer panels; a tree represents nested hierarchy.
03
Across platforms
WebiPadOSAndroidmacOSWindowsLinux
Web · iPadOS · Android · macOS · Windows · Linux
Web tabs need appropriate keyboard semantics; desktop settings may present a visually similar source list.
04
Go to the source
Primary documentation for the pattern and its platform conventions.