The tabs element allows you to display content under various views which can be selected by the user. The first label here (blue) represents the formatting when the option is selected.

Quick add a new tab by clicking the + sign on the right side.

You can edit the content under each tab by dragging elements into the blue slot.


To configure the tab, navigate to Config → Property. Under Tab Options, you’ll see a pair of inputs for each tab. The upper input is the actual value that tab takes on, and the lower is the display value.

Tab options: Each tab has a pair of input boxes.

  1. Enter the value of the tab in the first input box.

  2. Enter the display name of the tab into the second input box.

Add additional tabs with “+ Add an item”.

Default tab: The value of the default tab to display.

Type: Choose a style type. Options include the default, card, or border-card.

Position: Position the tabs at the top, right, bottom, or left of the element.

See Tooltip for tooltip configurations.

Supported Events

No supported events.

Supported Actions

Set Data: Change element data. See Data Store.

Set Loading: Set loading animation. See Set loading animations.

Visit Interactions for more on events and actions.

Last updated