iris-agent.co
Design analysis
A compact rounded panel returns to the atmospheric sky treatment, pairing a specific implementation promise with one focused demo action.
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/iris/650a6ac7-5b2c-4108-91e1-31520e600e3c-1790748230-6.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/iris/650a6ac7-5b2c-4108-91e1-31520e600e3c-1790748183746-full.webp - Component on Kage: https://kage.design/component/iris-cta ## Before you start Ask what conversion action the user's product needs and what concrete result the visitor should expect. Apply these principles to the user's brand and offer. Build a prominent but compact CTA panel with a rounded 14–18px container and an original atmospheric blue background around `#4f8bdc`, using a gradient, abstract texture, or licensed/generated background rather than copying the reference. Center an editorial serif headline, a concise sans-serif supporting sentence, and one primary dark button. Keep the content width around 520–650px and use strong vertical spacing so the panel feels intentional without becoming a second hero. Use near-black `#050505` for the button, white text, 12px radius, and a clear hover/focus state. Set generous 52–80px internal vertical padding and 28–40px horizontal padding. Keep the panel separated from surrounding content by 48–80px. Ensure the message states what happens after clicking, and make the CTA work equally well on mobile. ### Never - Never copy the reference CTA headline, product name, cloud scene, or button copy. - Never use vague promises without a concrete next step. - Never add competing secondary actions inside this panel.
kage