Lumina · Design, Prompted (glass-aurora-dark hero)
Dark glassmorphic SaaS hero for an AI prompt-to-UI tool: an animated aurora field (teal #2dd4bf + magenta #e879f9 on ink #0b0f14), a frosted-glass sticky nav, a Space Grotesk headline with an aqua-to-magenta gradient accent line, two floating glass product cards (prompt + canvas output) with small feature chips, and a quiet logo trust row.
Summary
A dark, glassmorphic SaaS hero for an AI prompt-to-UI design tool. Centered headline column over an animated aurora field (teal + magenta radial glows on near-black), with a frosted-glass sticky nav, a gradient duo-tone keyline in the headline, two floating glass product cards (prompt + canvas output), small floating feature chips, and a quiet logo trust row.
Style
Premium dark glassmorphism with an animated aurora background. Near-black ink canvas (#0b0f14) lit by soft radial blooms of aqua (#2dd4bf) and magenta (#e879f9); a faint white dot-grid adds depth. Surfaces are frosted glass (semi-transparent white fills, hairline white borders, heavy backdrop-blur + saturation, soft drop shadow + inner top highlight). Display type is Space Grotesk 700, body is Inter; the hero accent line and stat numbers use an aqua to magenta gradient text fill. CTAs are a single aqua to magenta gradient pill with a colored glow shadow.
Layout & Structure
Single full-viewport hero section. A fixed frosted-glass pill nav floats at the top. Centered max-width-3xl headline column (eyebrow pill, two-line headline with gradient accent line, subhead paragraph, two CTAs, social-proof avatar row). Below it, a max-width-5xl 12-column grid holds two floating glass cards (7-col prompt card + 5-col canvas-output card), with two small absolutely-positioned glass feature chips at the top-right and bottom-left of the card cluster. A centered logo trust row closes the section. Fully responsive: nav links and floating chips hide on small screens, headline scales down, CTAs and cards stack to a single column.
Sticky glass nav
Hero headline column
CTA row + social proof
Floating glass cards cluster
Floating feature chips
Trust logo row
Special Notes
Colors are an exact 3-color system: ink #0b0f14 (canvas), aqua #2dd4bf, magenta #e879f9, plus mint stops #a7f3eb / #f0abfc in gradients and body text #e8eef2. Fonts: Space Grotesk (display/headings, 500-700) + Inter (body, 400-700) via Google Fonts. Glass legibility depends on the dark vignette over the aurora, keep it. Honor the responsive reflow: hide md-only nav links and lg-only floating chips on small screens, stack the two cards and the CTA row, and scale the headline down to ~2.75rem on mobile. Built with Tailwind (CDN) + Iconify; no real photography, the visual interest is entirely gradient + glass + type.