--- title: "FAQ section design: anatomy, variants and examples | Kombai" description: "An FAQ section answers the questions people ask most, in their own words, so doubts get settled on the page instead of in a support inbox." canonical_url: https://kombai.com/glossary/faq-section/ author: "The Kombai Team" --- # FAQ section An FAQ section answers the questions people ask most, in their own words, so doubts get settled on the page instead of in a support inbox. - Also called: FAQ, frequently asked questions - Platforms: Web, Mobile - In the Kombai gallery: [199 web designs](https://kombai.com/gallery/web/faq/), [38 mobile designs](https://kombai.com/gallery/mobile/faq/) - [Verdant FAQ](https://kombai.com/gallery/inspirations/faq-web-5/) (Web) - [Murmur FAQ](https://kombai.com/gallery/inspirations/faq-ios-1/) (Mobile) - [Slatecrest](https://kombai.com/gallery/inspirations/faq-web-7/) (Web) ## What is an FAQ section? An FAQ section is a block of common questions with short answers, usually near the end of a landing, pricing or product page. The questions are most often an accordion, so people scan them all and open only the ones they care about. Long lists get split into topics, and a contact line at the end catches anything the list misses. - Each question is phrased the way people ask it, with the answer right under it. - A heading names the section, and topics or numbers keep long lists in order. ## When to use faq section - **Repeat questions.** Support answers the same few questions again and again. - **Doubts before buying.** Trials, refunds, delivery and billing, near the plans or the buy button. - **Policies in plain words.** Returns, privacy and payouts explained without the legal text. ## When not to use one - **The main message.** Don't hide what the product does inside a question. Say it on the page. - **Questions nobody asks.** Made-up questions read as marketing. Use the real ones from support. - **A full help center.** Hundreds of answers need search and categories, not one section. ## Anatomy 1. **Heading**: Names the section 2. **Topic tabs**: Optional, for long lists 3. **Question**: A button that opens its answer 4. **Answer**: Short and in plain words 5. **Contact line**: For anything not listed 6. **States**: Closed, open, topic, focus ## Variants We sorted every FAQ design in the Kombai gallery and found six patterns. ### 1. Centered accordion The default. One centered column of questions under a heading, each opening its answer in place. - [Aurelo](https://kombai.com/gallery/inspirations/faq-web-12/) (Web) - [Foldwell](https://kombai.com/gallery/inspirations/faq-web-142/) (Web) - [Kestrel Loop](https://kombai.com/gallery/inspirations/faq-ios-5/) (Mobile) ### 2. Heading beside the questions The heading and a short intro sit in a narrow left column, and the questions run down the right. - [Halcyra Grid](https://kombai.com/gallery/inspirations/faq-web-10/) (Web) - [Heddle](https://kombai.com/gallery/inspirations/faq-web-18/) (Web) - [Nimberly](https://kombai.com/gallery/inspirations/faq-web-100/) (Web) ### 3. Grouped by topic Tabs, chips or a side list split a long FAQ into topics like orders, billing and privacy. - [Wrenfold](https://kombai.com/gallery/inspirations/faq-web-44/) (Web) - [Alderway](https://kombai.com/gallery/inspirations/faq-web-20/) (Web) - [Sable Note](https://kombai.com/gallery/inspirations/faq-ios-10/) (Mobile) ### 4. Open answers No accordion. Questions and answers sit open in a grid of cards, for short answers people should read. - [Everlode Card](https://kombai.com/gallery/inspirations/faq-web-166/) (Web) - [Brackwater](https://kombai.com/gallery/inspirations/faq-web-150/) (Web) - [Millrace](https://kombai.com/gallery/inspirations/faq-web-25/) (Web) ### 5. Numbered questions Each question carries a number, 01, 02, 03, which suits short sets and editorial layouts. - [Mossvane](https://kombai.com/gallery/inspirations/faq-web-85/) (Web) - [Arborline](https://kombai.com/gallery/inspirations/faq-ios-4/) (Mobile) - [Driftlane](https://kombai.com/gallery/inspirations/faq-ios-12/) (Mobile) ### 6. With a contact card A card beside or below the questions points to a person, for anything the list does not answer. - [Paylane](https://kombai.com/gallery/inspirations/faq-web-3/) (Web) - [Workfolk](https://kombai.com/gallery/inspirations/faq-ios-31/) (Mobile) - [Northmoor](https://kombai.com/gallery/inspirations/faq-web-129/) (Web) ## Where faq sections show up ### Pricing and billing Trials, seats, refunds and invoices, often answered right below the plans. - [Antinode](https://kombai.com/gallery/inspirations/faq-web-24/) (Web) - [Marloft](https://kombai.com/gallery/inspirations/faq-web-102/) (Web) - [Loomhaven](https://kombai.com/gallery/inspirations/faq-ios-23/) (Mobile) ### Help centers A search field and topics on top, with the most-asked questions listed below. - [Ternwell](https://kombai.com/gallery/inspirations/faq-ios-7/) (Mobile) - [Patchbay](https://kombai.com/gallery/inspirations/faq-ios-17/) (Mobile) - [Zephrin](https://kombai.com/gallery/inspirations/faq-web-111/) (Web) ### Online stores Orders, delivery and returns: the questions shoppers ask before and after they buy. - [Marbrook Goods](https://kombai.com/gallery/inspirations/faq-web-42/) (Web) - [Pepperwick](https://kombai.com/gallery/inspirations/faq-web-73/) (Web) - [Sunbird](https://kombai.com/gallery/inspirations/faq-ios-2/) (Mobile) ### Partner programs Payouts, tracking windows and who can join, spelled out before people sign up. - [Hoverdeck](https://kombai.com/gallery/inspirations/faq-web-46/) (Web) - [Harlowvale](https://kombai.com/gallery/inspirations/faq-web-194/) (Web) - [Atelier Pass](https://kombai.com/gallery/inspirations/faq-ios-38/) (Mobile) ## FAQ section vs similar components | | [FAQ section](https://kombai.com/glossary/faq-section/) | [Accordion](https://kombai.com/glossary/accordion/) | [Feature section](https://kombai.com/glossary/feature-section/) | [Testimonials](https://kombai.com/glossary/testimonials/) | |---|---|---|---|---| | What it is | A section of questions and answers | A component that folds content away | A section that explains the product | A section of customer quotes | | Answers | Doubts that stop people acting | Whatever its panels hold | What the product does | Whether others trust it | | Best for | Pricing, support and checkout | FAQs, specs and settings | Landing pages | Building trust before a signup | ## Build notes - Build the questions as an accordion: each one a