Kage Design logo kage
audimate.ai
Audimate hero component

Design analysis

The hero uses a large centered headline, concise explanatory copy, dual actions, and a small compatibility note before transitioning into a prominent product film.

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/audimate/f5eee044-0aa0-46f8-a989-58039412e614-1792130729-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/audimate/f5eee044-0aa0-46f8-a989-58039412e614-1792130546049-full.webp
- Component on Kage: https://kage.design/component/audimate-hero

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

Build a centered dark hero directly below the navigation. Use a near-black background (#000), a very large responsive headline with one short accent phrase in violet (#9b72ff), two lines of supporting copy in white and soft gray, and a horizontal action row containing a bright primary download/demo button plus a quieter play-video action. Add a small muted compatibility line beneath the buttons. Keep the content column narrow and centered, with generous top and bottom spacing; the headline should dominate while the supporting copy remains readable at 18–22px. Use restrained motion: buttons may brighten on hover and the play control may show a subtle pulse, but do not autoplay disruptive media.

Never: use the reference's logo, product name, copy, illustrations, imagery, or exact visual identity.

More components