FAQ Premium: Premium Sections Component by Aidan Looker

A production-ready FAQ accordion with search, category filters, rich text, and SEO schema. 5 style presets, 3 layouts, and full color control. Drop it in, customise everything from the property panel, and ship a polished FAQ section in minutes.

What is FAQ Premium?

FAQ Premium is a fully featured, animated FAQ accordion component built for Framer. It includes live search with result highlighting, automatic category tabs, rich text formatting, per-item icons, CTA buttons, and FAQPage JSON-LD schema for SEO. Choose from five curated style presets or build your own with granular color controls. Ideal for SaaS landing pages, product sites, help centres, and pricing pages.

Core Features

Five style presets — Dark, Light, Indigo, Emerald, and fully Custom — with three layout modes: Cards, Dividers, and Minimal
Built-in search bar with instant filtering and keyword highlighting across questions and answers
Automatic category tabs generated from your FAQ data for fast, jump-free filtering
Rich text support for bold, italic, inline code, links, and ordered or unordered lists inside answers
FAQPage JSON-LD schema output for Google rich results, toggled with a single control
Four animated accordion icon styles (Chevron, Plus/Minus, Arrow, Caret) with optional icon background
Per-item icons and CTA buttons with customisable labels and links
Smooth spring-based open and close animations with configurable speed
Full keyboard navigation with arrow keys, Home, and End support

Controls inside Framer

FAQ Items

Question text
Answer text (supports markdown formatting)
Category label
Item icon (9 options including Question, Lightbulb, Shield, Zap, Star, and more)
CTA label and CTA link

Layout and Style

Layout Style — Cards, Dividers, or Minimal
Style Preset — Dark, Light, Indigo, Emerald, or Custom

Features

Search Bar — show or hide, with custom placeholder text
Category Tabs — show or hide, with custom "All" label
Numbering — show or hide question numbers (01, 02, 03)
SEO Schema — enable or disable FAQPage JSON-LD output

Colors (Custom preset)

Base colors — Background, Question Text, Answer Text, Accent, Accent Soft
Card Colors — Card BG, Card Border, Card Hover (Cards layout only)
Divider Color (Dividers layout only)
Search Colors — Search BG, Search Border, Highlight (when search is enabled)
Tab Colors — Tab BG, Active BG, Tab Text, Active Text (when categories are enabled)

Card Style

Border radius
Padding
Gap between items

Accordion Icon

Icon type — Chevron, Plus/Minus, Arrow, or Caret
Icon size
Icon background toggle
Icon Color and Icon BG Color (Custom preset)

Behavior

Multi-Open — allow multiple items expanded at once
Open First — first item starts expanded
Animation Speed — Slow, Medium, or Fast

Typography

Question Font (extended controls)
Answer Font (extended controls)

Best use cases

SaaS and startup landing pages that need a polished, on-brand FAQ section
Product and service pages with categorised questions across billing, features, and security
Help centres and knowledge bases with searchable, filterable content
Pricing pages that address objections with rich text answers and inline CTA buttons

Ship a professional FAQ section without code, without plugins, and without compromise. One component, every feature you need, ready for production.