Design a dark-mode website section: deep space telemetry with high-voltage neon cerulean enclosures and disciplined architectural columns.
LAYOUT
The composition follows a strict top-down hierarchical flow: an expansive hero CTA container occupies the upper 55% of the frame with centered content alignment. Below the card, a generous 64px vertical gap transitions into a multi-column footer spanning brand identity, four navigation categories, and an email capture module. The page terminates in a split-axis copyright and legal utility bar.
PALETTE (use these exact hex values)
- #040814 — Void Canvas: Deepest canvas tone behind footer links, copyright bar, and surrounding layout margins
- radial-gradient(ellipse at 50% 0%, #1e5eff 0%, #08215e 45%, #051130 100%) — Bioluminescent Blue Gradient: Hero card interior fill creating optical depth and simulated light emission
- #1d64f2 — Electric Primary Accent: Primary action button background, newsletter submit button, and brand badge fill
- #2553b8 — Trace Circuit Border: 1px structural outline of the hero card and decorative circuit brackets behind actions
- #ffffff — Text Stark White: Display headlines, primary CTA labels, column titles, and high-contrast wordmarks
- #94a9c9 — Text Atmospheric Slate: Card subcopy, footer navigation links, and descriptive lead text
- #5e779d — Text Muted Phosphor: Footnotes, trust indicators, copyright text, input placeholders, and secondary meta labels
- #0c1833 — Ghost Slate Surface: Secondary button background, newsletter input container, and social icon buttons
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, Manrope, DM Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 14px subheading, 16px body-lg, 48px display. Tracking -0.02em at display, 0.04em at caps badges. The voice is authoritative, enterprise-grade, and engineered for high-velocity software infrastructure. The typography feels deliberate and structural, using clean vertical cuts and wide apertures that maintain crystalline legibility even at 11px micro-copy. Inter or Plus Jakarta Sans are optimal open-source replacements for this high-density SaaS treatment.
GEOMETRY & SPACING
Corner radii — cards 24px, links 4px, inputs 8px, buttons 10px. Spacing on a 4px unit, 24px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is created entirely through optical bioluminescence rather than drop shadows. High-value cards use a 1px boundary stroke combined with top-edge specular glints and a rich interior radial gradient that acts as a back-light. Lower-level components like input fields and secondary buttons nest deeper into the background using darker alpha-blended fills.
IMAGERY
Vector-only and graphical; no photographic human elements. Background textures rely on subtle cyan dot-matrix grid arrays and delicate SVG schematic vector lines that evoke circuit traces and telemetry dashboards. Any real-world photography or organic hand-drawn illustration would feel alien to this precise, technological canvas.
SIGNATURE DETAIL — the thing that makes this design itself
The integrated cobalt core: a high-radius card defined by an atmospheric royal-blue radial gradient, capped with a luminous specular edge line, and framed at the action tier by stepped horizontal circuit-trace vector paths.
MUST
- Anchor the CTA card with a centered radial gradient that concentrates brightness strictly behind the primary headline.
- Use geometric sans-serif typefaces with neutral neo-grotesque curves and tight negative display tracking (-0.025em).
- Keep footer column headers in pure white (#ffffff) at 14px medium/semibold to contrast against muted links (#94a9c9).
- Maintain high contrast (1px strokes) between interactive surfaces and deep void backgrounds using blue-tinted borders.
AVOID
- Never use pure black (#000000); always tint dark backgrounds with deep navy or midnight slate (#040814).
- Do not drop plain square borders on buttons; retain the uniform 10px rounded contour.
- Avoid warm accent tones like red, orange, or amber; stick strictly to cobalt, electric cyan, and slate blue.
- Never omit the subtle top-edge highlight specular line on the CTA card container.
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 中尝试 
