Kage Design logo kage
is.team
is.team faq component

Design analysis

The FAQ uses a split layout: a support-oriented intro and contact links on the left, with a clean accordion on the right. One answer is open while the remaining questions stay compact.

Prompt preview
## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Component: https://kage-design-assets.t3.tigrisfiles.io/components/is-team/5ec87905-607a-4eeb-afa3-a1b534169c52-1789538687-9.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/is-team/5ec87905-607a-4eeb-afa3-a1b534169c52-1789538583775-full.webp
- Component on Kage: https://kage.design/component/is-team-faq

## Before you start
Ask me what objections and support questions my customers commonly have, what contact channels I offer, and what brand voice to use. Then turn those answers into this FAQ pattern.

Create a two-column FAQ section with a left intro containing a bold short heading, supportive paragraph, and two text links for contact and all questions. On the right, use a large editorial “FAQ” heading and a vertical accordion list. Each question gets 18–24px vertical padding, a thin #E8E8E8 bottom border, bold 13–15px text, and a small chevron at the far right. The open item reveals 12–13px gray answer text with comfortable line height. Use a white background, near-black #171717 typography, gray #777 supporting text, and one small accent for links. Animate expansion gently, support keyboard navigation, and expose aria-controls/aria-expanded. Stack the columns on mobile.

Never use the reference's logo, product name, copy, illustrations, imagery, or exact questions.

More components