17 components

Faq

FAQ Simple Accordion
Faq
FAQ Simple Accordion

A clean, minimal FAQ section with collapsible accordion items. Features a bold heading followed by expandable question-answer pairs with smooth animations. Best suited for straightforward FAQ pages where users need quick access to common questions without visual clutter.

faqquestionsanswers+6 more
FAQ Static List
Faq
FAQ Static List

A non-interactive FAQ layout displaying all questions and answers in a vertical list format. Each Q&A pair is separated by a border, making it easy to scan through all content at once. Ideal for shorter FAQ sections where users benefit from seeing all information without clicking.

faqquestionsanswers+6 more
FAQ Centered Accordion
Faq
FAQ Centered Accordion

A centered FAQ section with a prominent heading, descriptive subtext, and collapsible accordion items. The centered layout creates visual hierarchy and draws attention to the content. Perfect for landing pages or dedicated FAQ sections that need a polished, professional appearance.

faqquestionsanswers+6 more
FAQ Badge Support
Faq
FAQ Badge Support

A comprehensive FAQ section featuring a badge label, centered heading with description, accordion items, and a dedicated support call-to-action section at the bottom. The separator and contact button encourage users to reach out if they can't find their answer. Ideal for customer service pages.

faqquestionsanswers+7 more
FAQ Numbered List
Faq
FAQ Numbered List

A centered FAQ layout with numbered question cards. Each item displays a sequential number badge alongside the question and answer in a bordered card format. The badge header and centered layout create a structured, organized appearance. Great for step-by-step guides or prioritized FAQs.

faqquestionsanswers+7 more
FAQ Numbered Grid
Faq
FAQ Numbered Grid

A responsive two-column grid layout displaying numbered FAQ cards. Features a centered header section with heading and description, followed by numbered question-answer cards arranged in a grid. Maximizes space efficiency while maintaining readability. Ideal for pages with many FAQs.

faqquestionsanswers+6 more
FAQ Split Help
Faq
FAQ Split Help

A two-column FAQ layout with the heading and description on the left, accordion items on the right, and a prominent help banner at the bottom. The split design creates visual interest while the help section provides a clear path to support. Perfect for product pages or documentation sites.

faqquestionsanswers+7 more
FAQ Categorized Sections
Faq
FAQ Categorized Sections

An organized FAQ layout with multiple category sections, each containing its own accordion group. Categories are displayed vertically with clear section headings. Ideal for comprehensive FAQ pages covering different topics like General, Billing, and Support in distinct sections.

faqquestionsanswers+6 more
FAQ Muted Cards
Faq
FAQ Muted Cards

A bold FAQ section with accordion items displayed as muted background cards. Each question expands within its own card container, creating clear visual separation between items. The muted styling provides a softer, more approachable appearance. Great for modern, minimalist designs.

faqquestionsanswers+6 more
FAQ Bordered Badge
Faq
FAQ Bordered Badge

A centered FAQ section featuring a badge with help icon, prominent heading, description, and bordered accordion cards. The icon-enhanced badge adds visual interest while bordered cards create clear item separation. Ideal for help centers or knowledge base pages.

faqquestionsanswers+7 more
FAQ Gradient Categories
Faq
FAQ Gradient Categories

A visually striking FAQ section with a gradient background container housing categorized accordion groups in a two-column grid. The gradient styling adds depth and visual interest while categories keep content organized. Perfect for SaaS products or modern web applications.

faqquestionsanswers+7 more
FAQ Sidebar Navigation
Faq
FAQ Sidebar Navigation

An interactive FAQ layout with a sticky sidebar navigation for category filtering. Clicking a category smoothly scrolls to that section while highlighting the active category in the sidebar. Ideal for extensive FAQ pages with many categories where quick navigation is essential.

faqquestionsanswers+7 more
FAQ Card Categories
Faq
FAQ Card Categories

A categorized FAQ layout with each category displayed in its own card container, arranged in a responsive grid. Features a subtle plus-pattern background for visual texture. Each card has a header and accordion content. Great for visually separating different FAQ topics.

faqquestionsanswers+7 more
FAQ Icon Benefits
Faq
FAQ Icon Benefits

A benefits-focused section displaying feature cards with icons in a responsive grid. Each card features a circular icon container, title, and description. While not a traditional FAQ, it answers 'why choose us' questions through benefit highlights. Ideal for feature showcases or value propositions.

faqbenefitsfeatures+6 more
FAQ Rounded Cards
Faq
FAQ Rounded Cards

A polished FAQ section with accordion items displayed as rounded cards within a muted container. The rounded styling and layered card design create a modern, friendly appearance. The container provides visual grouping while individual cards maintain clear separation.

faqquestionsanswers+7 more
FAQ Profile Sidebar
Faq
FAQ Profile Sidebar

A two-column FAQ layout with a sticky sidebar featuring a support representative profile, contact information, and CTA button. The personal touch of showing a team member builds trust while providing easy access to support. Perfect for customer-focused businesses wanting to humanize their help section.

faqquestionsanswers+8 more
FAQ Split Hero
Faq
FAQ Split Hero

A dark-themed split-screen FAQ section with animated accordion on the left and a large image on the right. Features prominent heading and subheading with animated accordion FAQ items. Best for landing pages, product pages, and service pages requiring FAQ visibility.

faqsplithero+5 more
OpenSite Logo

Delivering the world's first Semantic UI site builder

Components

© 2026 OpenSite. All rights reserved.