ravio.com
Design analysis
A final pale CTA pairs a strong left-aligned headline and demo button with a right-side compensation-style progression visual, creating a memorable close before the footer.
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/ravio/21fc8fab-2ae9-4a70-87c8-10ebee6c9a8e-1789142160-7.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/ravio/21fc8fab-2ae9-4a70-87c8-10ebee6c9a8e-1789141806972-full.webp - Component on Kage: https://kage.design/component/ravio-cta-2 ## Before you start Ask what final conversion action matters most, what outcome the user should imagine, and what abstract visual can communicate progress for their product. Apply these principles to that product. Create a split final CTA on a pale warm background (#f7f8f0). The left column contains a large two-line serif headline, a short persuasive paragraph, and one dark filled button. The right column contains an original abstract progress visualization: for example, ascending steps, connected cards, a trend line, or a product outcome panel. Keep it clearly schematic and responsive, with thin geometric linework in #dfe4d9 and one restrained blue or green accent. Use a max-width content container, 48–80px vertical padding, 48–56px heading, 15px body copy, 8px button radius, and a two-column layout that stacks on mobile. The visual should reinforce progress without overpowering the CTA. Never: copy the reference's product name, headline, copy, compensation cards, person imagery, illustrations, logos, or exact visual composition.
kage