Preview image. Unlock full-res
Centered FAQ accordion on a warm off-white background with the first item expanded and the rest collapsed in rounded rows.
Summary
A single-column FAQ block centered on a warm off-white field, with the first question open in a white card and the remaining eight collapsed in light-grey rows.
Visual description
Centered heading "Frequently Asked Questions" in a bold dark sans-serif, with a subhead line "Have a question we didn't answer? Contact us" where "Contact us" is a green inline link with a chevron. Below sits a stacked list of accordion rows. The top row is expanded into a white rounded card with a minus icon, showing the question in bold and a three-line answer in grey. The eight rows below are collapsed light-grey rounded pills, each with a grey question on the left and a plus icon on the right. Consistent vertical gaps and full row width give an orderly, scannable list.
Key takeaway
The contrast between the open item (white card, dark text, minus) and the closed items (flat grey pills, muted text, plus) makes state instantly legible. The inline "Contact us" escape hatch in the subhead handles anything the list misses.
Reuse notes
A reliable pricing-page or pre-conversion FAQ for B2B SaaS. The expanded-first-item pattern reassures users the accordion works and seeds the section with content. Keep questions short so collapsed pills stay single-line.
