---
title: Tabs
description: "Show content in horizontal or vertical tabs, and control how the tab titles wrap and switch."
url: "https://flatsome.com/docs/tabs"
lastUpdated: 2026-10-21
---

The Tabs block shows one panel of content at a time, with tab titles to switch between them. It works for product details, FAQs, pricing plans, and anything else that would make a page long.

## Add tabs

1. Insert the **Tabs** block and pick a starting point: Tabs, Vertical, Fill, or Switch.
2. Click a tab title to rename it, and add blocks to its panel.
3. To add a tab, use the add block button inside the tab panels.

Each tab also has an **Anchor**. A link to the page with that anchor, such as `/shipping/#returns`, opens the page with that tab selected.

## Style and layout

Select the Tabs block to choose a **Style** (Simple, Underline, Outline, Tabs, Fill, or Switch) and a **Layout**: Horizontal, or Vertical with the titles beside the content. **Nav width** sets how wide the titles are in the vertical layout. The layout can be different on each screen size, for example vertical on desktop and horizontal on phones.

## Tab titles

Select the Tab List to control the row of titles:

- **Overflow**: **Scroll** keeps the titles on one line that scrolls sideways, **Wrap** moves them onto more lines.
- **Gap**: the space between titles.
- **Navigation**: font size, text transform, a divider, and **Activate** on click or on hover.

Overflow and Gap apply to the horizontal layout. To put a count or a *New* label on a title, see [Badge](https://flatsome.com/docs/badge.md).