# faq × # accordion

Featured Components⚛ TSX Live preview

Smooth Grid-Row Accordion

Height-animated FAQ rows using grid-template-rows 0fr→1fr — no fixed heights, perfect easing.

7.1k38.9k8.2kOpen

Accordion FAQ with plus/minus marker

Smooth <details>/<summary> accordion whose plus icon morphs into an x when open — no JS required.

37100Open

Smooth FAQ Accordion · Ultra Violet

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Ultra Violet palette.

65900Open

Smooth FAQ Accordion · Cyber Lime

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Cyber Lime palette.

48400Open

Smooth FAQ Accordion · Sunset Amber

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Sunset Amber palette.

17100Open

Smooth FAQ Accordion · Rose Gold

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Rose Gold palette.

66700Open

Smooth FAQ Accordion · Ocean Sky

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Ocean Sky palette.

33500Open

Smooth FAQ Accordion · Mint Breeze

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Mint Breeze palette.

66700Open

Smooth FAQ Accordion · Candy Pink

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Candy Pink palette.

57300Open

Smooth FAQ Accordion · Royal Gold

A FAQ accordion with buttery height animation using the grid-rows trick and rotated chevrons. Rendered in the Royal Gold palette.

24100Open

FAQ Accordion

Accessible FAQ accordion with smooth height animation and plus/minus icon morph.

FAQ Accordion with Smooth Height

FAQ accordion animating height and icon rotation, with one-open-at-a-time behaviour.

Billing FAQ Accordion

Billing-focused FAQ accordion with plan-specific answers and expandable invoice notes.

Legal Accordion (Terms)

Legal FAQ accordion covering terms, privacy and refunds with prose sections.