Brand
Changelog v1.4

Tabs

Tabs organize content into distinct panels that users can switch between.

Basic

General Notifications Security Disabled General settings and preferences. Configure notification delivery channels. Two-factor authentication and password settings. This panel is disabled.

Placement

Bottom

Tab 1 Tab 2 Tab 3 Content for tab 1. Content for tab 2. Content for tab 3.

With Icons

Overview Analytics Settings Dashboard overview with key metrics. Detailed analytics and charts. System configuration options.

Closable

File 1 File 2 File 3 Contents of File 1. Contents of File 2 (closable). Contents of File 3 (closable).

Usage

<sl-tab-group>
  <sl-tab slot="nav" panel="one">Tab 1</sl-tab>
  <sl-tab slot="nav" panel="two">Tab 2</sl-tab>

  <sl-tab-panel name="one">Content 1</sl-tab-panel>
  <sl-tab-panel name="two">Content 2</sl-tab-panel>
</sl-tab-group>