Frequently Asked Questions

What is a pure CSS accordion?

It's an interactive component that allows users to show and hide sections of content, built using only HTML and CSS without any JavaScript.

Why use the `
` and `` elements?

These elements are semantic and accessible out-of-the-box, meaning they inherently describe their purpose to assistive technologies and work even if CSS fails to load.

How does the animation work?

We use the Tailwind `group-open` modifier. When the parent `

` has the `open` attribute, the chevron icon rotates 180°. With `transition-transform`, this rotation animates smoothly.