Tabbed Categories
A categorized FAQ: a centered headline and pill CTA above category tabs, then the active category and its count beside a single-open accordion of answers.
A categorized FAQ: a centered headline and pill CTA above category tabs, then the active category and its count beside a single-open accordion of answers.
Search blocks by description or jump to a page.
The source for every Modern SaaS block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Tabbed Categories splits a long FAQ into a row of category tabs above a clean two-column panel. The active category and its question count anchor the left rail, while a single-open accordion lists the answers on the right. The first question opens by default, and switching tabs resets the panel so a reader always lands on an answer.
Each answer can hold plain paragraphs or a bulleted list, so a short reply and a richer breakdown sit side by side without breaking the rhythm. Everything is built from theme tokens, so the whole block adapts to light and dark with no external images.
Reach for this block when a single flat list of questions would run too long and your questions fall into clear groups. For a developer tools product the natural cuts are billing, API and integrations, security, and support, and the tabs keep that breadth compact without burying any topic. The left rail gives a reader a sense of how much sits under each category before they start reading.
It sits well near the foot of a landing page, after the proof points and the pricing, where it clears the last objections before the closing ask.
A natural flow around it on a Modern SaaS page:
Before
After
The obvious fit is five categories with a handful of questions each. A few other ways to use the frame:
Tip: keep each tab to three to six questions. When a category grows past that, split it into two tabs so the accordion never feels endless.