Design a dark-mode abstract background artwork: deep-space celestial scale grounded by high-precision glass instrumentation and luminous radiant typography.
LAYOUT
The composition follows an asymmetrical split hero layout. The left column houses the primary textual narrative, starting with an uppercase eyebrow, cascading down to a 56px three-line headline, supportive paragraph, and twin CTA buttons. The right hemisphere hosts the dramatic vertical cosmic vortex and observer silhouette, integrated with a floating HUD metric card. The bottom margin anchors the entire viewport with a three-pillar feature telemetry strip separated by 1px vertical borders.
PALETTE (use these exact hex values)
- #0c0714 — Void Black: deepest atmospheric background canvas color found along the deep cosmic perimeter
- #ff5d38 — Accretion Radiant: vibrant orange-red flare source used in background nebula illumination and glow falloffs
- #fca789 — Warm Dawn: soft coral tone used for the accent headline word breakthrough and top eyebrow text
- #ffffff — Star White: primary text headings, icon strokes, active links, and solid primary pill fills
- #c2b6c9 — Nebula Lavender: subordinate descriptive body paragraphs and secondary navigational links
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, SF Pro Display, Montserrat), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 16px body-lg, 18px subheading, 32px heading-lg, 56px display. Tracking -0.03em at display, 0.15em at uppercase caption. The typographic tone is intellectual, measured, and hyper-modern. By leveraging a high-grade geometric sans-serif (similar to Plus Jakarta Sans or Inter) set with tight negative display tracking and expansive uppercase caption letter-spacing, the interface feels like an advanced scientific expedition console rather than a generic tech platform.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 999px, buttons 999px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1320px container, airy density.
DEPTH
Depth is created strictly through optical luminosity and celestial perspective rather than standard CSS drop shadows. A three-tier depth model places the vast astronomical vortex at infinity, atmospheric crags and silhouette figures in the midground, and razor-sharp frosted glass HUD cards with 1px hairline edges directly on the user's viewport lens.
IMAGERY
The visual anchor is high-fidelity cinematic sci-fi artwork showing a vast glowing orange-white gravitational vortex shooting a collimated energy beam upward, balanced by a lone human silhouette seated on craggy terrain. Technical starmap rings, celestial coordinates, and subtle orbital line graphics overlay the scene to evoke rigorous interstellar exploration rather than fantasy mysticism.
SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the harmony between cinematic celestial realism (the swirling accretion disc and lone observer) and razor-thin, scientific HUD instrumentation overlays. It is properly applied when translucent cards and telemetry vectors appear as high-tech helmet visor or satellite readouts floating over deep space; it is broken when heavy solid backgrounds or opaque modal cards obliterate the underlying cosmos.
MUST
- Anchor text readability on the left third of the viewport where deep void background affords natural 12:1 contrast.
- Use solid white (#ffffff) pills strictly for top-level transactional CTAs to puncture the dark atmospheric depth.
- Highlight solitary operative words in titles using radiant warm coral (#fca789) to echo the celestial light source.
- Keep floating dashboard panels ultra-translucent with thin 1px rgba(255, 255, 255, 0.14) borders.
AVOID
- Do not place body copy or actionable buttons over high-exposure glowing areas of the accretion disk.
- Avoid heavy drop shadows; depth must come entirely from backdrop blurs, luminous flares, and hairline glass borders.
- Never apply thick saturated borders around cards; keep strokes hairline and semi-transparent.
- Do not use generic boxed containers; let cosmic background artwork bleed smoothly to viewport borders.
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. 在 DraPub 中尝试 
