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

Design analysis

A spacious off-white statement section combines a small eyebrow, very large serif claim, hand-drawn accent treatment, explanatory copy, and a dark pill button.

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-2.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-hero-2

## 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 spacious editorial statement section on an off-white background. Use a two-part composition: a small eyebrow and oversized serif statement on the left/top, followed by a lower row with a short explanatory paragraph and one dark rounded CTA aligned toward the right. Add an optional abstract hand-drawn underline, circle, or arrow as a brand accent, but keep it decorative and lightweight. Use generous vertical whitespace, a strong serif/sans contrast, and a pill-shaped button. Approximate colours: background `#F8F7F4`, primary text `#171717`, accent pink `#F25A7B`, hand-drawn accent `#4D2448`, button `#171717`, button text `#FFFFFF`. Use a 24px outer gutter and a restrained max-width.

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

More components