Tabs
Tab overview
Tabs are used for organizing information by showing one section while hiding other related sections at the same time. Tabs can be oriented either horizontally or vertically.
Variations
- Vertical - Reserved exclusively for a case's summary panel to present critical content, relevant discussions, unique views of data, or linked relationships such as child cases and dependencies.
- Horizontal - More generic usage of tabs used to represent sub-sections of content throughout an application.
Usage
- Never nest tabs (never have tabs within tabs within the same content section).
- Only show read-only information within tabs (no data entry).
- Everything underneath the tab group belongs to the active tab, and the tabs should fall on the grey background.
- Tabs in a single card design are easier to understand and manage. Use header levels to distinguish information under a tab.
- Limit number of tabs to 7 or less.
Looking for legacy UI Kit content? Click here
Last updated: Oct 2020