Design a dark-mode website section: deep space precision grounded by a radiant curved planetary horizon and colossal lower-case typographic anchor.
LAYOUT
The page vertically flows from a spacious, centered hero-style conversion cluster down to a complex 2-tier footer. The conversion block contains a status pill, stacked headline with colored emphasis, descriptive paragraph, and an asymmetric CTA button pair. Below the sweeping curved horizon arc, the footer splits into a heavy brand anchor on the left and four clean navigational columns on the right. Directly beneath navigation sits a full-width utility row featuring email capture, copyright text, and an enterprise compliance chip.
PALETTE (use these exact hex values)
- #06080d — Deep Void Canvas: Primary background for upper CTA section creating an infinite space aesthetic
- #0d111a — Horizon Obsidian: Floor surface for footer section defined beneath the curved arc boundary
- #2b66f6 — Electric Cobalt: Interactive focus for primary CTA button, submit action, and logotype punctuation dot
- linear-gradient(90deg, rgba(56,189,248,0.4) 0%, rgba(99,102,241,0.6) 50%, rgba(217,70,239,0.3) 100%) — Horizon Glow Stroke: 1px hairline rim accentuating the curving boundary between CTA and footer
- #ffffff — Pure White: High-contrast headings, active button labels, and main logotype fill
- #94a3b8 — Muted Slate: Body descriptions, footer navigation links, and standard input placeholders
- #64748b — Subtle Charcoal: Copyright text, secondary metadata, and inactive icons
- #131926 — Input Container Fill: Background fill for input fields, social icon circles, and micro-badges
- #22c55e — Telemetry Emerald: Indicator pulse dot within the physical AI pill badge
TYPOGRAPHY
Typeface Inter (or Geist Sans,SF Pro Display,Helvetica Neue), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 14px body, 16px body-lg, 20px subheading, 48px heading, 140px display. Tracking -0.03em for display, 0.15em for uppercase tracking. The typography conveys surgical, enterprise-grade engineering confidence. Inter or Geist Sans provides neutral, unpretentious legibility across micro-labels and technical categories. The colossal display wordmark injects a human, memorable presence through its soft lowercase geometry, accented sharply by the punchy cobalt terminal dot.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 120px between sections, 1240px container, comfortable density.
DEPTH
Depth is rendered purely through chromatic surface stepping and luminous edge highlights rather than drop shadows. The top canvas sits in an infinite black void (#06080d), while the footer rises as a physical planetary curvature highlighted by a 1px atmospheric gradient rim. Embedded controls like inputs and social pills use recessed fills (#131926) with crisp hairline borders (#1e2638).
IMAGERY
This interface avoids photographic or illustrative imagery, letting bold geometric typography and technical horizon geometry carry the visual weight. Vector iconography is limited to pure line-drawn social marks, telemetry dots, and directional arrow glyphs. Any added illustrations would dilute the rigorous, industrial-scale physical AI ethos.
SIGNATURE DETAIL — the thing that makes this design itself
The singular defining move is the glowing convex planetary horizon line crowned with a subtle multi-color gradient hairline stroke, which visually elevates the footer into an orbital foreground. Misusing this element by flattening it into a straight rule or over-saturating the stroke glow destroys the delicate spatial illusion of an atmospheric limb.
MUST
- Retain the curved horizon boundary with its subtle gradient stroke when transitioning between CTA and footer.
- Use uppercase tracked micro-typography (11px, letter-spacing: 0.18em) exclusively for system telemetry and category headers.
- Keep the primary brand blue (#2b66f6) reserved strictly for key actions, focus indicators, and the logo period dot.
- Anchor the footer with an oversized lowercase wordmark counterbalanced by high-density multi-column lists.
AVOID
- Never replace the curved horizon divider with a standard straight horizontal border line.
- Avoid applying glowing gradients or drop shadows to the massive footer logo.
- Do not capitalize the letters in the 'fern' display wordmark; it must stay strictly lowercase.
- Never style footer navigation links in pure white; reserve #ffffff for headings and interactive hover states.
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