Kage Design logo kage
ultracite.ai
Ultracite v8 testimonials component

Design analysis

A compact testimonial band leads with a clear section title, then gives each quote enough width and author context to feel human. A separate sponsor row closes the proof section without competing with the quotes.

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/ultracite-v8/2cfe6d77-9aac-44fd-bb06-05dad12091d2-1792303308-7.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/ultracite-v8/2cfe6d77-9aac-44fd-bb06-05dad12091d2-1792303236925-full.webp
- Component on Kage: https://kage.design/component/ultracite-v8-testimonials

## Before you start
Ask who can provide authentic testimonials, what permissions and attribution are available, and whether the user's product has sponsors or partners. Use only approved material while applying the structure below.

Build a testimonial section with a large heading at the top and a three-column quote grid beneath it. Give the first quote more width if one customer story is especially important, while keeping the other quotes readable. Each quote should include an author avatar only if supplied, the person's name, handle or role, and enough vertical padding to feel intentional. Separate columns with subtle rules. Add a slim sponsor or partner strip below with a short label, several restrained marks, and a small link.

Use #f7f7f4, #171716 text, muted #6c6c66 copy, and #deded9 dividers. Quote text should be 20–24px with a comfortable 1.3 line height; metadata 12–13px. Keep avatars circular at 28–36px and avoid excessive card shadows. On mobile, stack quotes and allow the sponsor row to wrap. Provide accessible attribution and a reduced-motion-safe interaction if quotes become a carousel.

### Never
- Never use the reference's logos, product names, copy, illustrations, or imagery.
- Never fabricate quotes, identities, or sponsorship relationships.
- Never turn testimonials into an auto-advancing inaccessible carousel.

More components