Click any question to reveal the answer
A FAQ accordion is a user interface component that organizes frequently asked questions in a compact, space-efficient format. Questions are displayed as clickable headers, with answers hidden until the user expands a section. This design pattern helps reduce visual clutter on web pages.
This component uses proper semantic HTML with <button> elements for the triggers. It includes ARIA attributes like aria-expanded and aria-controls to communicate state to screen readers. All interactions are fully keyboard accessible and focus states are clearly visible.
Yes. This implementation allows any number of sections to be expanded simultaneously. Each accordion item functions independently. Some designs restrict to a single open item, but this version gives users more flexibility.
Completely. Everything — HTML, CSS, and JavaScript — is contained within this single file. It requires no external dependencies, no build steps, and works offline when saved as index.html and opened in any modern browser.