Accessible FAQ Accordion
CMS-ready, and built for Webflow.
Each question is a button that toggles its answer open or closed. Opening one automatically closes any other open item. The first is open by default. It uses custom CSS in the <head> and JS before the closing </body> tag in the page settings.
Yes. The component uses 'aria-expanded' and 'aria-controls' so screen readers correctly announce the state of each item. The trigger is a <button> element, so keyboard navigation works out of the box.
Yes, the CMS structure is set up to reflect Webflow's native Collection List structure.
As little as possible. Transitions, icon rotation, and open state are all handled with CSS classes. The JS only handles what CSS can't — height animation and ARIA attribute updates.