krea.ai
Design analysis
A comparison headline leads into three side-by-side processing panels, making relative latency and output quality easy to compare.
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/krea-3/dbe75373-d211-428a-9d9b-aa6c396006bc-1792389816-10.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/krea-3/dbe75373-d211-428a-9d9b-aa6c396006bc-1792389704928-full.webp - Component on Kage: https://kage.design/component/krea-3-feature-grid-4 ## Before you start Ask what the user's product and brand are, then apply the following principles to their comparison section rather than copying this reference. Build a comparison feature with a split heading row: a large two-line statement on the left and a concise explanatory paragraph on the right. Below, show three equal-width media panels with aligned top labels, soft blurred or placeholder states, and bottom metadata. Add a centered segmented control over the panels for modes such as original, faster, and highest quality. Use white background, #f5f5f2 panel surfaces, 1px #e7e7e3 borders, 14–16px radius, and small 12px labels. Keep columns synchronized so users can compare the same input; stack them into a swipeable carousel on mobile. Never: - use the reference logo or product name - copy competitor names, figures, or copy - reuse its imagery or illustration - reproduce the exact layout or visual assets
kage