Design a dark-mode website section: an atmospheric planetary arc glowing beneath high-contrast midnight typography and precision modular console panels.
LAYOUT
The composition follows a centered hierarchical pyramid transitioning into an anchored horizontal deck. The hero stacks an eyebrow badge, two-line display headline, supportive body paragraph, dual CTA buttons, and a four-column trust bar along the central axis. Directly below the trust bar, the glowing horizon arc introduces the wide 24px rounded footer card comprising brand overview, structured four-column link architecture, and an inline newsletter subscription field.
PALETTE (use these exact hex values)
- #050914 — Deep Cosmos Void: Primary background canvas for the hero and viewport framing.
- #080E1A — Deck Surface: Elevated background fill for the expansive footer console card.
- #2563EB — Horizon Glow Arc: Diffused luminous curvature dividing the action zone from the footer structure.
- #1D64EC — Primary Action Blue: Solid primary action fill for key CTA button and submit controls.
- #A7F3D0 — Headline Gradient End: Terminal mint highlight in the dual-tone secondary hero headline.
- #FFFFFF — Pure Starlight: Primary headers, active labels, brandmark title, and prominent actions.
- #94A3B8 — Subdued Slate: Secondary copy, descriptive subtitles, and standard footer links.
- #1E293B — Dim Outline: Structural framing lines for card borders, input strokes, and pill badges.
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display, Geist), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 20px subheading, 36px heading, 60px display. Tracking -0.03em at display, +0.12em at eyebrow badge. The typographic tone is authoritative, hyper-modern, and technically assured, executed through a clean geometric grotesque sans-serif with tight display letter spacing (-0.035em). Its clinical clarity balances humanistic warmth and artificial intelligence infrastructure. Standard web substitution with Inter or Plus Jakarta Sans preserves the structural precision.
GEOMETRY & SPACING
Corner radii — cards 24px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 20px gaps, 96px between sections, 1200px container, comfortable density.
DEPTH
Depth is created entirely through optical atmospheric illumination rather than traditional drop shadows. A radiant horizontal glow curve simulates a distant illuminated planetary limb, casting a faint ambient edge onto the top boundary of the footer container card.
IMAGERY
There is a total absence of photographic or illustrative human imagery, replaced by precise structural geometry, cosmic light gradients, and minimalist monoline SVG iconography. Any illustrative or skeuomorphic asset would compromise the razor-sharp synthetic aesthetic.
SIGNATURE DETAIL — the thing that makes this design itself
The singular identifying signature is the sweeping curved horizon glow line spanning the full width of the interface, separating the central conversion area from the grounded navigation deck. To execute properly, render an ultra-wide radial-gradient ellipse with a sharp cyan focal crest fading into deep royal blue. It is commonly ruined by making the blur too harsh, turning a planetary horizon into an ordinary drop shadow.
MUST
- Keep the atmospheric blue curve gentle and continuous across the entire viewport width.
- Pair the pure white hero line strictly with the cyan-to-mint gradient secondary line.
- Use 8px border-radius consistently across all interactive controls and inputs.
- Ensure trust metrics and feature metadata utilize clean 16px thin outline icons.
AVOID
- Do not use sharp 0px or fully rounded pill shapes for primary buttons.
- Never apply colored glow effects directly to body text; reserve glow for the horizon arc.
- Do not break the four-column link layout into cluttered accordion panels on desktop.
- Avoid solid pure black (#000000); use deep blue-tinted void tones (#050914).
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. Try in DraPub