Design a dark-mode website section: cosmic deep-space canvas energized by vibrant cobalt auroras and disciplined multi-column architecture.
LAYOUT
The layout is divided vertically into two clear tiers: a dynamic 480px-tall asymmetric CTA block followed by a dense 6-column tabular footer. The CTA aligns content strictly to the left third of the grid, allowing the right two-thirds to carry the decorative aurora graphic. Below, the footer divides into brand metadata (left), four equal navigation columns (center), and an email capture card (right).
PALETTE (use these exact hex values)
- #050B17 — Void Black: Primary background canvas for the CTA section
- #080F1D — Deep Footer Navy: Footer container background providing a solid grounding surface
- #0066FF — Electric Cobalt: Primary call-to-action button fill and high-intent interactive states
- #5EEAD4 — Aurora Cyan: Eyebrow text badge, icon sparkle, and plasma mesh highlights
- #FFFFFF — Text Primary: Headlines, section labels, and prominent interactive triggers
- #94A3B8 — Text Secondary: Body paragraphs, supporting marketing descriptions, and footer links
- #475569 — Text Muted: Form placeholders, copyright statements, and disclaimers
- #0F1A2A — Surface Input: Background fill for the newsletter email input field
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, Geist, SF Pro Display), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px subheading, 15px body, 18px body-lg, 44px display. Tracking -0.02em at display, 0.08em at eyebrow. The typographic tone is ultra-modern, technical, and frictionless, relying entirely on a neutral neo-grotesque sans-serif. Tight display tracking (-0.025em) lends an authoritative enterprise finish to the main headline, while wide tracking on micro-labels adds architectural precision. Inter or Geist are direct open-source replacements.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 32px gaps, 96px between sections, 1200px container, comfortable density.
DEPTH
Depth is created entirely through optical lighting and glow fields rather than drop shadows. The background features dynamic radial luminosity that blooms from cobalt into cyan and violet, while foreground controls sit flush or subtly inset within the dark base.
IMAGERY
Abstract generative celestial art dominated by sweeping curved streaks, subtle geometric coordinate grid lines, and glowing pinprick stars. Literal photographic imagery or 3D rendered product mockups are avoided in favor of intangible, high-speed automated intelligence metaphors.
SIGNATURE DETAIL — the thing that makes this design itself
The singular focal signature is the high-energy curved plasma aurora emerging from deep navy space across the right flank of the CTA. It balances the strict, left-anchored typography by framing the conversion funnel in atmospheric light without compromising legibility.
MUST
- Keep CTA headline constrained to max-width 560px on the left to allow the right-side artwork to breathe.
- Use uppercase 11px teal tracking for pre-heading badges with high character spacing.
- Maintain high contrast by keeping primary body text strictly within #94A3B8 on dark surfaces.
- Pair primary solid action buttons with simple textual arrow links for secondary actions.
AVOID
- Do not let the glowing plasma art cross into the text block and degrade reading contrast.
- Never use full-width solid button fills when placed in the multi-column footer.
- Do not use high-saturation colors for footer links; keep them subdued at #94A3B8.
- Avoid pill-shaped round buttons in this system; adhere strictly to the 8px border radius.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1792:1024. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
