Skip to main content

Accordion

A collapsible list using native <details>/<summary>. Children are item: elements. Use checked on an item to open it by default.

Basic usage​

accordion: FAQ
  item: What is Figdown?
    A plain-text DSL for wireframing web pages.
  item: Is it free?
    Free for solo projects.
  item: Which browsers are supported?
    Any modern browser.

Open by default​

accordion: Frequently Asked Questions
  checked item: What is Figdown?
    A plain-text DSL for wireframing web pages. Write UI like you write Markdown — no design tools needed.
  item: Is it free?
    Free for solo projects.

Rich content in panels​

Each item panel accepts any content — text, buttons, inputs, other elements:

accordion: Settings
  item: Notifications
    checked toggle: Email alerts
    toggle: Push notifications
  item: Privacy
    checkbox: Share usage data
    blue primary button: Save preferences

Reference​

Child modifierEffect
item:A collapsible item
checked item:An item that is open by default