
Preview image. Unlock full-res
Festival poster behind frosted glass — the UI recedes into gray silence so a technicolor 3D world can explode through the center of the page.
Luma feels like a summer festival poster designed by a typographer — warm, alive, and unapologetically joyful. The page is nearly achromatic in its UI chrome (near-black #131517 text, mid-gray #656768 secondary, light-gray backgrounds) which makes the explosion of color in the hero 3D render feel earned and deliberate. The signature move is a full-spectrum radial gradient — cyan through violet through pink through orange — used as a single accent arc on the logo mark, transforming a system-font UI into something recognizably branded. Headlines run at 64px weight 400 with -0.016em tracking, relying on size alone rather than weight to command attention — the restraint is the statement. The CTA button is a dark near-black pill (#333537) against white, inverting the typical bright-CTA convention so the colorful hero imagery provides all the visual energy. Use the Luma Spectrum radial gradient exclusively on the logo mark / brand icon — never apply it to buttons, backgrounds, or text elsewhere Reserve Flamingo #f31a7c for single accent phrases within otherwise monochromatic headlines — one phrase maximum per heading Set display headlines (64px) at weight 400 with letter-spacing -0.016em; resist increasing weight to bold even for hero contexts Keep CTA button fill at #333537 (Charcoal) against white backgrounds — let photography and 3D renders provide the chromatic energy Use #656768 (Graphite) for all secondary UI text: nav links, subtext, footer labels, icon fills Apply 15px border-radius to buttons and interactive cards; use 8px for smaller tags and nav items Maintain -0.016em letter-spacing across all type sizes from 13px to 64px — this single value unifies the entire type system Never use the Luma Spectrum gradient as a button background, section fill, or text gradient outside the logo mark Don't increase headline weight above 400 for emphasis — use Flamingo #f31a7c inline color instead Don't add drop shadows or card elevation to the primary UI chrome — the design is intentionally flat to let imagery carry visual depth Don't use Flamingo #f31a7c on more than one word cluster per screen — it loses meaning if applied broadly Don't use pure #000000 for body text — use Obsidian #131517 which carries slight warmth and reduces harshness against white Don't place colored or gradient backgrounds behind the hero text column — white only, so the split layout reads as grounded UI vs expressive imagery









