FAQ Section With Photo Consult Panel

Pro

Centered FAQ badge and heading over a blurred photo panel, with a consult card on the left and numbered question cards on the right. Follows light and dark.

When to use FAQ Section With Photo Consult Panel

Reach for this when the FAQ should sit on a place, not a blank band. A badge and heading stay on the page. A rounded panel holds a blurred still, a consult card, and three numbered questions. One row opens at a time. Plus turns into a close mark. The black Book a Consultation pill is the only action.

Skip it when you cannot own the photograph, or when the page already has a still beside the list. Empty hashes under Book a Consultation are a brochure. The shipped copy is a fictional garden studio, so replace the questions, the answers, the still, and the booking URL before this goes to production. The section follows light and dark. Cards stay white on the photo so they still read as the objects on the scene.

Block details

Category
FAQ Sections
Renders
JavaScript animation. Paints first, then animates
Theme
Follows the site theme in light and dark
Responsive
Mobile, tablet and desktop breakpoints are already set
Dependencies
clsxframer-motiontailwind-merge
Source
232 lines, 8 KB in one file
Install
wensity add faq-section-with-photo-consult-panel --type block
Stack
React, Next.js, TypeScript and Tailwind CSS v4
Licence
Included with Wensity Pro. The CLI copies the file into your repository and you own it from there
Tags
light, dark, faq, accordion, photo, cta
Last updated

More faq sections