Kage Design logo kage
hinge.co
hinge.co testimonials component

Design analysis

A near-black testimonial panel uses a large quote, attribution, and understated carousel progress indicators to create a high-contrast social-proof moment.

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/hinge-co/fc8d8d16-7276-4f4c-b1c9-567702ba4b3c-1789146938-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/hinge-co/fc8d8d16-7276-4f4c-b1c9-567702ba4b3c-1789146918698-full.webp
- Component on Kage: https://kage.design/component/hinge-testimonials

## Before you start
Ask what the user's product and brand are, then apply the principles below to their context rather than reproducing this reference.

Build a dark testimonial section with substantial top and bottom padding. Add a small eyebrow at the top, then a large serif quotation set to a readable measure of roughly 620px and a compact attribution beneath it. Use a large decorative opening quotation mark, but keep it typographic rather than illustrative. Add thin horizontal carousel indicators along the bottom; the active segment should be brighter than inactive segments. Use a near-black background `#191919`, warm-white text `#F5F2EE`, muted metadata `#C8C4C0`, and 1px separators `#4A4A4A`. Support keyboard-accessible previous/next controls and pause any automatic rotation.

Never use the reference logo, product name, exact labels, copy, illustrations, or imagery.

More components