Tabs
Let users navigate between form steps with labeled tabs.
Last updated
Was this helpful?
Let users navigate between form steps with labeled tabs.
The Tabs element lets users navigate form steps from labeled tabs. The tab for the current step appears active. Clicking a tab navigates to its linked step.

When you add a Tabs element, Feathery can prefill tabs from nearby form steps. You can rename labels, change linked steps, and add or remove tabs in the Properties panel.
Open the Tabs element's Properties panel to manage its tabs.
Each tab has:
Label: Text displayed on the tab
Step: The form step opened when a user clicks the tab
Each step can link to only one tab on a Tabs element. Add another step before adding another tab.
Enable Validate and submit on click to save the current step's data before navigation. When disabled, a tab click navigates without submitting.
Link Tabs elements on different steps to share tabs and labels across your form. Editing one linked element updates every linked element.
Adding Tabs to a form with existing tabs links it automatically when possible. You do not need to recreate the tabs on each step.
Along with standard element styles, Tabs supports:
Direction: Display tabs horizontally or vertically
Gap: Set spacing between tabs
Default, Hover, and Active: Set background, font, and border styles for each state. The active tab links to the current step.
The Feathery SDK and API reference Tabs components with type equal to tab.
Last updated
Was this helpful?
Was this helpful?