Skip to main content

Tabs

Tabs in Astro applications are used to divide major areas of content and to indicate work process.

Rules of Thumb

High Level Tabs are often process/workflow oriented. Process oriented Tabs should:

  • Appear in the upper left quadrant.
  • Be clearly labeled.
  • Guide users through a sequential process.

Interior/Compact Tabs

For use outside of main navigation, a more compact Tab component can be used.

Rules of Thumb

Examples

Do: To guide users through a process, correctly place and label Tabs to reflect a step-by-step process.
Do: To guide users through a process, correctly place and label Tabs to reflect a step-by-step process.
Don’t: Stack or improperly nest Tabs.
Don’t: Stack or improperly nest Tabs.