• Docs
  • Components
  • Blocks
  • Admin
CtrlK
Get Started
  • Introduction
  • Setup
  • CLI
  • VS Code Extension
  • Figma Code Connect
  • MCP Server
  • llms.txt
  • Changelog
Foundations
  • Design Tokens
  • Theming & Modes
  • Semantic Colors
  • Spacing
  • Typography
Testing
  • Test Guide
  • Performance Tests
  • Visual Regression
Components
  • Accordion
  • Activity Feed
  • Alert
  • Avatar
  • Badge
  • Breadcrumbs
  • Button
  • Card
  • Carousel
  • Checkbox
  • Collapsible
  • Combobox
  • Command Palette
  • Context Menu
  • Date Picker
  • Dialog
  • Dropdown Menu
  • File Upload
  • Hover Card
  • Input
  • Kbd
  • Label
  • Menubar
  • Metric Card
  • Multi Select
  • Navigation Menu
  • Pagination
  • Popover
  • Progress
  • Quick Actions
  • Radio
  • Rating
  • Resizable
  • Segmented Control
  • Select
  • Separator
  • Sheet
  • Skeleton
  • Slider
  • Spinner
  • Split Button
  • Stepper
  • Switch
  • Table
  • Tabs
  • Tag Input
  • Textarea
  • Timeline
  • Toast
  • Toggle
  • Toggle Group
  • Tooltip
  • Tree View
Blocks
  • Activity Feed
  • App Shell
  • Authentication Block
  • Benefits Section
  • Cta Section
  • Data Table
  • Empty State
  • Faq Section
  • Feature Grid Section
  • Footer Section
  • Hero Section
  • Kpi Dashboard
  • Kpi Strip
  • Link Card
  • Metric Card
  • Navigation Header
  • Pagination Footer
  • Pricing Table
  • Quick Actions
  • Settings Screen
Resources
  • API Reference
Empty StateFeature Grid Section
Empty StateFeature Grid Section
Empty StateFeature Grid Section

FAQ Section

Expandable questions and answers for support content.

Overview

FAQ Section displays frequently asked questions in an accordion format, allowing users to expand and collapse individual questions. Built on top of the Accordion component for consistent behavior.

Frequently Asked Questions

Everything you need to know

1
2
3
4
5
6
7
8
9
10
11

Minimal FAQ

Code Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

Props

  • title - Section title (optional)
  • description - Section description (optional)
  • items - Array of FAQ items (required)
  • className - Additional CSS classes (optional)

FAQItem

  • question - FAQ question (required)
  • answer - FAQ answer (required)

Install

1

Accessibility

FAQ section uses the Accordion component which provides full keyboard navigation, ARIA attributes, and screen reader support. Questions are properly labeled and answers are associated with their questions. Compliant with WCAG 2.1.