Topic Columns
A static FAQ grouping bold questions and short muted answers in a two column grid under three uppercase topic labels, closed by a contact panel.
A static FAQ grouping bold questions and short muted answers in a two column grid under three uppercase topic labels, closed by a contact panel.
The source for every Marketing block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Topic Columns lays a whole FAQ out flat. A centered headline and lede sit above three question groups, each opened by a small uppercase topic label on a hairline rule, with bold one line questions and short muted answers arranged in a two column grid. Nothing folds and nothing hides, so a reader can sweep the section in seconds and land on the answer they came for.
A soft, bordered contact panel closes the section with a short reassurance line and a secondary pill button for anything the grid does not cover. The topics, questions, and answers live in one typed array, so adding a group or reordering questions is a data edit rather than a layout change, and every color comes from theme tokens so the block adapts to light and dark.
Reach for this block when your answers are short enough to show in full and hiding them behind an accordion would just add clicks. It fits a self serve billing or subscription product well, where buyers arrive with the same predictable questions about payment, data safety, and how fast they can start, and being able to skim every answer at once builds more trust than a tidy list of closed rows.
A natural flow around it on a Marketing Pro page:
Before
After
The obvious fit is billing, security, and getting started questions with four answers each. A few other ways to use the frame:
Tip: keep every answer to two lines at desktop width. When one grows past that, the detail probably belongs in your docs with a link, not in the grid.