Design a dark-mode abstract background artwork: deep void indigo bathed in undulating neon particle waves and luminous lavender glass morphism.
LAYOUT
The page follows a classic asymmetrical hero architecture over a full-viewport canvas. The top edge houses a streamlined horizontal navigation header. The middle region is divided: the left 45% carries the stacked display headline, secondary description, and dual pill CTAs, while the right 55% hosts the radiant celestial point-cloud sphere. Across the lower edge sits a balanced 4-column row of translucent glass metric cards.
PALETTE (use these exact hex values)
- #020514 — Void Abyss: Deepest canvas background anchor absorbing edge bleed and framing particle lighting.
- #080e2b — Midnight Indigo: Atmospheric midtone in lower particle waves and frosted card backdrops.
- #f8fafc — Stellar White: High-contrast primary headline and button text ensuring razor-sharp legibility.
- #94a3b8 — Muted Nebula: Subordinate body copy, nav links, and secondary card descriptions.
- #38bdf8 — Electric Cyan: Bioluminescent low-wave particle highlights and fine icon stroke details.
- #a855f7 — Luminous Violet: Mid-spectrum particle lighting, orbital glow, and button gradient midpoints.
- #f472b6 — Solar Magenta: High-energy planetary rim light and intense atmospheric focal flares.
- linear-gradient(135deg, #c084fc 0%, #6366f1 100%) — Lavender Glow: Primary interactive fill applied to primary pill buttons and active badges.
TYPOGRAPHY
Typeface Inter Display (or Plus Jakarta Sans, SF Pro Display), weights 400/500/600. Sizes 13px caption, 14px body-sm, 15px body, 18px body-lg, 24px heading, 68px display. Tracking -0.03em at display, 0 at body. The type choice is clinical, highly engineered, and restrained, counterbalancing the high-drama sci-fi background art. A neutral neo-grotesque sans-serif with tight apertures and clean geometry conveys enterprise-grade reliability and compute precision. Inter or Plus Jakarta Sans are optimal open-source replacements, matching the clean tall x-height and technical aesthetic.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 999px, buttons 999px. Spacing on a 8px unit, 20px gaps, 120px between sections, 1360px container, airy density.
DEPTH
Depth is created not through drop shadows, but through atmospheric luminescence and layered physical opacity. The deepest plane is the black void (#020514), overlaid with a 3D field of glowing particle trails and an orb rim-lit in neon pink-violet. Feature cards float above this simulation using 16px backdrop blur, subtle inner borders, and high-translucency indigo glass fills.
IMAGERY
The visual language relies on complex, algorithmic 3D particle systems resembling luminous cosmic topography and planetary data spheres. Colors within the imagery drift between neon cyan, royal purple, and brilliant solar magenta. Flat stock photography, cartoonish vectors, or low-poly 3D models are strictly forbidden.
SIGNATURE DETAIL — the thing that makes this design itself
The defining hallmark is the bioluminescent 3D particle topography terminating in an intensely backlit celestial sphere on the upper right, over which frosted glass cards sit weightlessly. To implement correctly, the imagery must look like an organic mathematical point cloud with volumetric magenta rim lighting, not a flat gradient blur. Misusing it involves placing flat or opaque cards that block the particle flow.
MUST
- Anchor headline text strictly to the left half to let the cosmic particle artwork breathe on the right.
- Use pill radii (999px) for all standalone buttons and chips to contrast against rectilinear cards.
- Apply backdrop-filter blur(16px) and a hairline border (rgba(147, 197, 253, 0.15)) to all floating cards.
- Keep display typography tight (line-height <= 1.1) to create visual cohesion against the vast negative space.
AVOID
- Do not use solid opaque backgrounds for cards, which destroys the particle wave depth.
- Do not place warm colors like orange, red, or yellow into the primary interface palette.
- Do not center-align the main hero headline; it disrupts the spatial balance with the celestial sphere.
- Do not apply heavy drop shadows with dark offsets; use outer luminescence or specular border lines.
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 中尝试 
