Usage

Tabs comes with label and icon.

Guidance

  • Tabs should indicate a type to characterize their subjects.

  • Able to add new Tabs by using + icon near Tabs component on page tree.

When to use

  • Use Tabs to represent openable panes.

Additional info

  • Consider updating the gutter to set spaces between Tabs.

  • Consider updating position to set placement of Tabs.

Variations

  • The updatable properties of Tabs are type, position, and gutter.

  • The updatable behavior of Tabs is centered.

  • The updatable style features of Tabs are margin, padding, size, overflow, and CSS.

  • The updatable style features of Tab List are margin, padding, size, overflow, background, border, and CSS.

  • The updatable style features of Tab List Nav are display, margin, padding, size, overflow, typography, background, border, effects, and CSS.

  • The updatable style features of the Tab List Tab are margin, padding, typography, background, and CSS.

  • The updatable style features of Active Tab List Item are typography and CSS.

  • The updatable style features of Tab List Content are margin, padding, size, overflow, background, border, and CSS.

  • The updatable properties of Tab Panes are tab labels and icons.

  • The updatable style features of Radio Button are margin, padding, size, overflow, background, border, and CSS.

  • The usable dynamic properties of Tabs are type, tabPosition, centered, hideAdd, tabBarGutter, tabBarExtraContent, hidden, and style.

  • The usable dynamic properties of Tab Pane are tab, hidden, and style.

Did this answer your question?