Kage Design logo kage
runnova.ai
NOVA CLI v1.0 hero component

Design analysis

The hero uses a full-bleed sunset field image, oversized two-line headline, and a bottom-aligned supporting statement with a single high-contrast CTA.

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/nova-cli-v1-0/f9d737a9-3081-4768-944e-79473fdb1d08-1791525757-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/nova-cli-v1-0/f9d737a9-3081-4768-944e-79473fdb1d08-1791525679651-full.webp
- Component on Kage: https://kage.design/component/nova-cli-v1-0-hero

## Before you start
Ask what the user's product does, its audience, and its brand direction. Then create an original hero using these principles for that product.

Build a tall, rounded-corner hero with an atmospheric full-bleed background image and a dark gradient overlay that preserves readable text. Center a large sans-serif headline with a contrasting italic serif or editorial second line. Use a restrained white palette, approximately #f7f7f4, with a warm accent such as #f0a05b. Place concise supporting copy at the lower left and one pill CTA at the lower right; keep both aligned to the same bottom grid. Use a 28–34px radius, overflow hidden, and generous inset padding of 32–48px. The headline should have a strong 56–72px desktop scale, tight line height, and responsive reduction on mobile. Add a subtle hover lift to the CTA and ensure the overlay meets WCAG contrast.

Never use logos, product names, copy, illustrations, or imagery from the reference.

More components