Kage Design logo kage
descript.com
descript.com hero component

Design analysis

The hero uses a deep burgundy field, oversized centered editorial typography, concise explanatory copy, one bright CTA, and a large product-interface visual beneath it.

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/descript-com/c210b18a-1678-4bef-91b5-c444a8589f04-1789146910-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/descript-com/c210b18a-1678-4bef-91b5-c444a8589f04-1789146857587-full.webp
- Component on Kage: https://kage.design/component/descript-hero

## Before you start
Ask what the user's product does, its target audience, and its brand direction. Use those answers to create an original hero following these structural principles.

Create a tall, centered hero immediately below the navigation. Use a dark wine background around #43071b or the user's equivalent, a small uppercase eyebrow, and a very large high-contrast headline with an editorial serif or appropriately distinctive display face. Keep the headline to two or three deliberate lines with tight line-height, then add a short supporting paragraph at a readable width and a single vivid primary CTA. Place a wide product demonstration or abstract interface visual below the CTA with generous breathing room; it should feel like the proof of the promise, not decorative filler. Use warm off-white text #fff4f1, muted pink secondary text #f3cbd2, and coral-red CTA #ff4b4b. Use a max-width around 760px for text, 64–96px vertical spacing, and 10–14px radii for interactive elements. On mobile, reduce type size and preserve the visual hierarchy rather than shrinking everything proportionally. Include hover, focus, and loading states for the CTA.

### Never
- Never reuse the reference's product name, headline, copy, logo, interface screenshot, or imagery.
- Never add several competing CTAs or let the visual overpower the promise.

More components