Category Columns

About this block

Category Columns opens with a centered heading and a one-line subheading, then expands into a three-column grid. Each column carries a topic label underlined by a hairline rule, followed by a definition list of questions and plain-text answers stacked beneath it. The demo ships three topics, Billing, Product, and Security, each holding three Q&A pairs.

Every column is independent. You can rename the topic labels, rewrite any question or answer, add a fourth topic by extending the data array, or drop a column entirely. There are no interactive elements, so the block works without client-side JavaScript and renders instantly on the server.

When to use

Reach for this layout when your FAQ content divides naturally into a small number of topics and you want readers to jump straight to the section that applies to them. For a developer tools company this is a strong fit for a docs or pricing support page: engineers coming in with a billing question, an API export question, or a security compliance question can each find their column at a glance without scrolling through a long accordion.

Compared to a single accordion the columns put all topics on screen at once, which shortens time to answer for confident readers. Use an accordion variant when you have more than four or five questions per topic and need to keep page length in check.

A natural flow around it on a Marketing Pro page:

Before

• A pricing section so readers land on billing questions right after they see plan details
• A features section to address product questions in context

After

• A CTA block to convert readers who just had their last objection answered
• The With CTA Banner sibling if you want a support contact prompt immediately below

What you can display

One intro sentence sets the topic, then each column handles its own domain. A few ways to fill the three columns for a developer tools product:

• Billing and plans. Trial terms, upgrade paths, and refund policy so prospects can self-serve before they reach sales.
• API and integration details. Rate limits, authentication methods, and data export options that engineering teams ask during evaluation.
• Security and compliance. Certification status, encryption standards, and SSO support to satisfy the security review in a buyer's procurement process.

Tip: keep each column to three or four Q&A pairs so the columns stay roughly the same height and the grid looks balanced at every breakpoint.