Legacy Tabs

Overview

View on FigmaView on GitHub

The LegacyTabs (Originally named Tabs) has been deprecated. Instead you can use the new Tabs component.

Purpose

Tabs are used to organise and switch between blocks of related content, this can be between different pages, or sections of content within a single page.

Anatomy

The Tabs component can be broken down into the following elements -

  1. Text label
    The text label describes the content of the tab to the user.

  2. Trim
    The trim shows the user which tab is selected.

Variants & States

Appearance: Default, Light

The Tabs component is made up of individual items.
State: Active Default, Active Gradient, Inactive, Hover, Focus