Figma Accordion

/

/

/

/

Figma Accordion

Preview

Figma Accordion

Figma Accordion

The Accordion is a lightweight UI component that expands and collapses content, commonly used for Figma FAQs, product features, and help sections.

Accordion Anatomy

SetVariantsPropertiesCopy to Figma
Accordion16Type Default, SecondarySize Small, MediumState Collapsed, Collapsed Hover, Expanded, Expanded Hover
AccordionGroup24Type Default, SecondarySize Small, DefaultItems x3, x4, x5, x6, x7, x8

Accordion can function as a standalone element or within a group to organize multiple entries. Ideal for answering user questions, revealing hidden content, and improving page structure.

Type

Interactive component

Behavior

Auto layout

Figma Accordion

Accordion

figma accordion component

figma accordion

accordion ui

Interactive component

Design systems with Figma — 10× faster

Level up your design, build robust systems, websites, and applications that will stay beautiful forever.

UI KIT TRUSTED BY TOP TEAMS AND BRANDS

Design systems with Figma — 10× faster

Level up your design, build robust systems, websites, and applications that will stay beautiful forever.

UI KIT TRUSTED BY TOP TEAMS AND BRANDS

Design in Figma
10X faster

Level up your design, build robust systems, websites, and applications that will stay beautiful forever.