Design a dark-mode abstract background artwork: deep cosmos bioluminescence meets precision typography in a sleek generative ai frontier.
LAYOUT
Asymmetric two-column split within a 1280px container on a fixed dark canvas. The left column (spanning ~55% width) holds the kicker badge, 3-line display headline, explanatory paragraph, dual CTA buttons, and a 3-column micro-feature grid. The right column is entirely dedicated to the illuminated cosmic sphere and planetary dust rings, which bleed off the edge.
PALETTE (use these exact hex values)
- #050814 — Void Deep: Deepest canvas background behind all imagery and content layers
- #0b1026 — Subtle Surface Navy: Atmospheric base gradient tone providing slight ambient light
- #5fe8bd — Bioluminescent Mint: Primary brand tint, left anchor of hero gradient text and CTA buttons
- #f59dc6 — Nebula Pink: Secondary brand tint, right anchor of hero gradient text and CTA buttons
- #fcd682 — Solar Flare Gold: Mid-glow particle highlight on the celestial sphere and upper nebula wave
- #ffffff — Pure Starlight: Primary headings, active navigational text, and high-emphasis labels
- #929db5 — Stardust Muted: Body copy, inactive nav links, and sub-labels in footer features
TYPOGRAPHY
Typeface Inter Display (or Plus Jakarta Sans, SF Pro Display, Geist), weights 400/500/600. Sizes 11px caption, 13px body-sm, 15px body, 18px subheading, 56px display. Tracking -0.03em on headline, 0.05em on badges. Inter Display (or high-neutral neo-grotesque substitutes like Plus Jakarta Sans or Geist) offers an engineered, precise, and highly legible tone. Tight negative letter-spacing on the 56px display title gives it commanding authority, while wide tracking on micro-labels evokes aerospace and data telemetry instrumentation.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 10px, buttons 10px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is created purely through luminous optical layering rather than box-shadow drops. Glowing background nebulas and particle fields sit on level 0, glowing spheres hover on level 1, and sharp vector typography alongside semi-transparent 1px glass borders form the foreground plane.
IMAGERY
A photorealistic generative cosmos featuring a celestial dark sphere ringed by multi-colored orbital particle dust in teal, gold, and magenta. An auroral ribbon curves gracefully from the top center down behind the planet, blending seamlessly into the dark background. Off-brand imagery includes cartoon vectors, generic corporate stock photography, or sharp flat geometric art.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone mint-to-magenta spectral gradient carried consistently across both the hero typography and the primary CTA button, visually echoing the planetary particle glow on the right. Misusing it by scattering it over borders, icons, or secondary links degrades its distinctive focus and dilutes the cosmic atmosphere.
MUST
- Restrain gradient text strictly to hero headline highlights to avoid visual fatigue.
- Use high-resolution particle artwork on the right with a seamless fade to void black on the left.
- Pair deep atmospheric blacks (#050814) with fine 1px transparent borders for high-tech subtlety.
- Keep navigation and secondary buttons translucent with backdrop blur to let background lighting breathe.
AVOID
- Do not use sharp box shadows or opaque white card backgrounds anywhere.
- Do not make all headline lines gradient; keep line 1 solid white for legibility.
- Never replace the orbital particle sphere with flat 2D vector illustrations.
- Avoid fully saturated primary neon colors; use luminous pastel tints like #5fe8bd and #f59dc6.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 3408:2416. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
