DOCUMENTATION

Tab Bar

Last updated May 2026
Advanced Block
All plans

A tabbed content switcher. Each tab has its own independent rich-text editor — add paragraphs, lists, images, and other blocks inside each tab. Three visual styles and configurable alignment.

Adding a Tab Bar

/ → Tab Bar
Type /tab on any empty block and press Enter.
Block palette
Click + on any block → Advanced → Tab Bar.

Tab styles

Pill style (default)
Tab content goes here. Each tab has its own independent rich-text editor.
Underline style
Tab content goes here. Each tab has its own independent rich-text editor.
Chip style
Tab content goes here. Each tab has its own independent rich-text editor.

Managing tabs

Click tab
Switches the active tab. The content editor below updates to show that tab's content.
Settings panel → Add tab
Adds a new empty tab to the right of the existing tabs.
Settings panel → Rename
Rename a tab via its label input field in the settings panel.
Settings panel → Delete
Delete a tab and its content from the settings panel. You can delete down to a single remaining tab.
Tabs cannot be reordered or renamed by double-clicking — both of those only happen through the settings panel's label input, one tab at a time.
Tab content is stored as rich HTML per tab in block metadata. Each tab has its own TipTap editor instance — you can use inline formatting (bold, italic, links, inline code) inside each tab's content.

Settings

Style
Pill (rounded buttons, default), Underline (border-bottom active indicator), or Chip (enclosed pill group).
Alignment
Left, center, or right — controls the flex alignment of the tab row.
Tab labels
Each tab has an editable label, renamed from its input field in the settings panel — not from the tab bar itself.