Figma FAQ

Preview

Figma FAQ

Figma FAQ Blocks

FAQs include quick answers to common customer questions in an organized format. You can use FAQ blocks to create help and customer pages, boost your website SEO, and efficiently address common customer inquiries and issues.

FAQ Anatomy

Set	Variants	Properties
FAQ	18	Layout 01, 02, 03, 04, 05, 06Size Desktop, Tablet, Mobile

FAQ blocks are one set of eighteen variants — six layouts, 01 to 06, each in Desktop, Tablet and Mobile sizes — built from accordion stacks with supporting headings, buttons and social icons for help and support pages.

FAQ AI Prompt

Paste this into Claude, ChatGPT, or Figma Make:

Build six FAQ page blocks in Figma, each in Desktop, Tablet and Mobile widths. Layout 01: a centred heading and intro over a single column of accordion rows, the first expanded. Layout 02: a two-column grid of accordions under a heading. Layout 03: a heading and description on the left with a contact card — avatar, support email and a Contact us button — and the accordion list on the right. Layout 04: a category tab bar above the accordions for Billing, Account and Product. Layout 05: question cards in a three-column grid, each with an icon, question and short answer, no accordion. Layout 06: a search input above the accordions with a Still have questions band at the bottom holding social icons and a button. Build the accordion row as a nested instance of the kit's Accordion with a chevron that rotates when expanded, collapse multi-column grids to one column on mobile, and keep headings, buttons and icons as kit instances so the blocks restyle with the design system.

FAQ pages are primarily designed with Accordion components combined into a responsive stack, as well as other UI elements such as Cards, Tooltips, and social icons to help users navigate questions about your product.