Components / FAQ Accordion
Live preview — rendered in this site's theme
FAQ Accordion
Is there a free plan?
Yes — full product, forever.
Can I use my own domain?
Pro sites serve on any hostname with SSL.
Usage
<details>-based daisyUI collapse: works before CSS loads, keyboard-accessible for free.
Rules
min-h-0 + tight padding overrides daisyUI's chunky default title box.
- Hairline dividers (
divide-y) instead of card-per-question boxes keeps it editorial.
- Open the first item by default (
open) so readers see the pattern.
- Keep answers to 1–2 sentences; link out for depth instead of nesting paragraphs.
- For radio-style single-open behavior, swap to the input-based accordion variant.
HTML Copy-paste source
<div class="max-w-2xl mx-auto divide-y divide-base-content/10 border-y border-base-content/10">
<details class="collapse collapse-plus bg-transparent" open>
<summary class="collapse-title text-base font-medium tracking-tight py-4 min-h-0">Is there a free plan?</summary>
<div class="collapse-content text-sm text-base-content/70"><p>Yes — the full product, forever, with a watermark and subdomain.</p></div>
</details>
<details class="collapse collapse-plus bg-transparent">
<summary class="collapse-title text-base font-medium tracking-tight py-4 min-h-0">Can I use my own domain?</summary>
<div class="collapse-content text-sm text-base-content/70"><p>Pro sites serve on any hostname with automatic SSL; domains are managed at the account level.</p></div>
</details>
<details class="collapse collapse-plus bg-transparent">
<summary class="collapse-title text-base font-medium tracking-tight py-4 min-h-0">Do you support markdown?</summary>
<div class="collapse-content text-sm text-base-content/70"><p>Every page serves a markdown twin at the same URL with <code>.md</code> appended.</p></div>
</details>
</div>