lu.ma
Design analysis
A centered, high-contrast headline with a multicolored emphasis line, concise supporting copy, primary creation CTA, and a quieter discovery link creates a clear two-path entry point.
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/lu-ma/a4be0bf4-46ad-4066-8582-e9890f24d9e0-1789146184-1.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/lu-ma/a4be0bf4-46ad-4066-8582-e9890f24d9e0-1789146157883-full.webp - Component on Kage: https://kage.design/component/lu-ma-hero ## Before you start Ask what the user's product is, who it serves, and what its brand voice and visual identity are. Apply the following system to that product and write original copy. Create a centered hero immediately below the navigation. Use a compact eyebrow, an oversized two- or three-line headline, and make one phrase visually expressive with a restrained left-to-right gradient (for example #c43a9f through #f08a24). Keep the rest of the headline near-black (#111111). Add a short muted paragraph beneath it in #9a9a9a with a comfortable line height, followed by a solid black pill-shaped primary CTA and a smaller low-contrast secondary text link below. Use a generous white canvas, a max content width of roughly 560px, and vertical spacing that makes the headline the dominant element. Heading size should be approximately 56–64px on desktop with tight line-height around 0.9–1.0; body copy 15–16px. Buttons may use 14px text, 36–42px height, 999px radius, and a soft shadow. Keep the interaction simple: primary button darkens slightly on hover, secondary link gains underline or opacity. Never: use the reference's logo, product name, copy, illustrations, imagery, or exact headline/gradient treatment.
kage