Tab

Stable
Show details
Stable
Published: January 09, 2025
Updated: October 13, 2025

Anatomy

Anatomy summary lists and describes all the elements within a component (including nested components).

tabs-anatomy
  1. Tab: a singular tab containing a label, used to navigate between content.
  2. Label: a textual label describing the contents of a tab.

Variants

Variants contain different versions of the component depending on specific properties, such as state, size, colour, optional iconography, etc.

Tab
Tab
state disabled
Tab
Tab
state hover
Tab
Tab
state rest (default)
Tab
Tab
state selected

Help and support