Blocks

Tabs Block

2 min read

> Organize content into switchable tabbed sections with rich text support and icons.


Overview

The Tabs block presents multiple content sections in a tabbed interface, allowing visitors to switch between related content without leaving the page. Each tab supports rich text editing and optional icons for visual clarity.


Fields

FieldDescription
HeadingOptional section title above the tabs
SubheadingSupporting text below the heading
TabsRepeatable tab entries with title, icon, and content
LayoutHorizontal or Vertical tab arrangement
StyleVisual style: Pills, Underline, or Boxed
AlignmentTab alignment: Left, Center, Right, or Full width
Tab SizeSize of tab buttons: Small, Medium, or Large
Content WidthControl the maximum width of the content area
AnimationEntrance animation with optional stagger effect

Tab Fields

Each tab includes:

FieldDescription
TitleThe tab button text (required)
IconOptional Heroicon displayed next to the title
ContentRich text content shown when tab is active (required)

Layout Options

LayoutDescription
HorizontalTabs displayed in a row above content
VerticalTabs displayed in a column beside content

Style Options

StyleDescription
PillsRounded button-style tabs
UnderlineMinimal tabs with active underline indicator
BoxedBordered tabs with connected appearance

Examples

Choose Theme