Tabs

Tabs show alternatives, like package managers or platforms, in one place, so readers pick the one that applies to them.

<Tabs>
  <Tab title="npm">
    ```bash
    npm install acme
    ```
  </Tab>
  <Tab title="bun">
    ```bash
    bun add acme
    ```
  </Tab>
</Tabs>

Tabs with npm and bun on a Notra site — How it looks on your site

The first tab is open when the page loads, and readers switch with a click or with the arrow keys. Without JavaScript, every tab shows one below the other under its title.

Props

Tab

string

required

The tab’s label.

Tabs takes no props.

Styling

Tab groups carry the class tabs and each panel carries tab.

Last modified on October 8, 2026

Get started

Domains

Write content

Components

Customize

Publish

Reference

Props

Tab

Styling

​Props

​Tab

​Styling

Props

Tab

Styling