Design a dark-mode abstract background artwork: a deep space canvas framing human ambition through celestial nebula gradients, luminous typography, and midnight glassmorphism.
LAYOUT
The composition follows an asymmetric split-hero structure bounded by a 1280px max-width container. Navigation runs across the top edge with generous vertical breathing room. The left 45% accommodates the vertical conversion stack (eyebrow, display headline, body, action buttons, social proof), while the right 55% presents the narrative visual focal point. Floating across the bottom margin sits an integrated four-column glass shelf summarizing product capabilities.
PALETTE (use these exact hex values)
- #060814 — Cosmic Obsidian: deep background canvas absorbing the bottom and left viewport margins
- linear-gradient(135deg, #F87171 0%, #C084FC 100%) — Nebula Sunset Gradient: primary call-to-action button fill and display text accent gradient
- #FFFFFF — Pure Starlight: headline initial line, primary button labels, and active navigation titles
- #94A3B8 — Ethereal Lavender: body description copy, inactive nav links, and metric captions
- #FF6E85 — Solar Coral: uppercase sub-badge tracking line above display title
- #38BDF8 — Ion Cyan: luminescent highlights along planetary rings and ground reflections
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, Outfit, Urbanist), weights 400/500/600/700. Sizes 12px caption, 13px body-sm, 15px subheading, 16px body, 24px heading, 60px display. Tracking -0.03em at display, 0.08em at eyebrow. Plus Jakarta Sans delivers a clean, futuristic, yet remarkably approachable tone. Its geometric clarity prevents the dense celestial visual effects from overwhelming readability, grounding the high-fantasy scene with modern tech sophistication. When substituting, prioritize modern geometric sans typefaces like Inter or Outfit that feature strong legibility at small sizes and tight geometric letterforms at display scales.
GEOMETRY & SPACING
Corner radii — cards 24px, links 4px, inputs 999px, buttons 999px. Spacing on a 8px unit, 20px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is created purely through luminous optical hierarchy and translucent glass overlays rather than physical drop shadows. The background imagery recesses into deep space black while the foreground UI elements float via subtle backdrop blur (16px to 24px) and 1px cosmic-indigo hairline borders. High-intensity backlighting and starry particle glows behind the central figure establish natural atmospheric layering.
IMAGERY
Features cinematic digital concept art depicting a solitary learner working from a rugged mountaintop peak against an immense sweeping galaxy. The artwork relies on energetic streaks of starry stardust, deep indigo skies, and radiant violet-to-cyan ambient lighting. Any stock photography, flat clip art, or sterile corporate office photography would completely dismantle this aesthetic.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone display title paired with the bottom frosted ribbon dock that spans across both dark space and the illuminated mountain peak. To execute it correctly, ensure the glass container uses 16px backdrop blur, a 1px border colored rgba(99, 102, 241, 0.25), and 24px rounded corners. Misusing it by adding a heavy drop shadow or making the surface completely opaque immediately destroys the atmospheric harmony.
MUST
- Anchor text content firmly against the dark, high-contrast left third of the viewport.
- Use 999px pill radii exclusively for all buttons, tags, and small metric badges.
- Render the second headline line with a vibrant coral-to-lilac linear gradient.
- Apply subtle glassmorphism (backdrop-filter blur 16px) with an indigo-tinted border to floating shelves.
AVOID
- Do not use sharp 0px or boxy rectangular corners for interactive buttons.
- Never place heavy body text directly over high-saturation nebula streaks.
- Avoid opaque solid white or light-grey cards that break cosmic immersion.
- Do not use warm yellow or green accents that clash with the magenta-cyan palette.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 3424:2416. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub