Pattern

Accordion

Two accordion experiments in one playground: CSS-only disclosure panels and interactive FAQ collapse cards.

Variation

Accordion (CSS Only)

Checkbox state controls panel expansion without JavaScript.

Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ipsum, reiciendis!
Lorem ipsum dolor sit amet consectetur adipisicing elit. A, in!
Lorem ipsum dolor sit amet consectetur adipisicing elit. A, in!

Variation

FAQ Collapse

Click each question to toggle expanded answer state.

Why shouldn't we trust atoms?

They make up everything.

What do you call someone with no body and no nose?

Nobody knows.

How many tickles does it take to tickle an octopus?

Ten-tickles!