Staaarter

Open List Layout

The simplest possible FAQ list: a single column with a divider between each entry, the question set slightly bolder, and its answer paragraph immediately below it. Every entry is always open, with no icons, badges, numbers, or interactivity.

By Staaarter Team
FAQ
Docs
Live preview

Docs

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its dependencies and any missing npm packages, and installs them straight into your project.

npx shadcn add https://staaarter.com/r/open-list-layout.json

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/faq/faq8.tsx instead.

Usage

The file also exports faq8Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Faq8, faq8Demo } from "@/components/blocks/faq/faq8";

export default function Page() {
  return <Faq8 {...faq8Demo} />;
}

Props

PropTypeDefaultDescription
headingstring"Frequently asked questions"Section heading.
descriptionstringundefinedOptional supporting copy under the heading.
itemsFaq8Item[]noneOrdered list of question and answer entries.
classNamestringnoneExtra classes for the outer section element.

Types

type Faq8Item = { question: string; answer: string };

Behavior notes

  • Fully static and decorative: every question and answer is always visible, there is no accordion, toggle, or any other interactive element.
  • Entries are separated with a plain divide-y divider, deliberately simpler than every other block in this category, to serve as a minimal-effort contrast option.

More FAQ Blocks

View all →

collapsible-accordion

Collapsible Accordion

Stacked cards with expandable sections, for full-length answers in a compact format.

three-column-grid

Three Column Grid

Q&A pairs arranged in a responsive grid layout, always open.

tabbed-categories

Tabbed Categories

Sidebar navigation with category tabs and an accordion of that category's questions.

searchable-accordion

Searchable Accordion

Search input that filters accordion items in real-time by question and answer text.

grouped-sections

Grouped Sections

FAQs organized into titled sections, each with its own independent accordion below it.

side-by-side-image

Side-by-Side Image

Accordion paired with a large image on the left or right.