Design a dark-mode website section: deep midnight terminal aesthetics ignited by high-voltage coral accents and disciplined engineering metrics.
LAYOUT
The layout progresses in a three-stage downward cascade. The top zone features a high-impact split grid: left-aligned value propositions and dual CTAs opposing a real-time developer terminal card. Below lies a continuous horizontal telemetry bar dividing the page with live status and key statistics. The sequence closes with an expansive 5-column mega-footer spanning product, technical, and subscription hierarchies.
PALETTE (use these exact hex values)
- #07090e — Canvas Deep: Primary background tone across the entire footer and hero CTA sections.
- #0d111a — Surface Panel: Background for code preview terminals and interactive inputs.
- #1b2231 — Border Hairline: Section dividers, card outlines, and tabular cell separators.
- #ff5c58 — Coral Core: Primary CTA fill, standout title emphasis, and active brand mark.
- #22c55e — Operational Green: Status indicator lights representing healthy deployments and live systems.
- #ffffff — Text Pure: Top-tier headings, primary CTA text, and high-priority metrics.
- #8491a5 — Text Muted: Secondary copy, descriptive labels, and inactive link lists.
TYPOGRAPHY
Typeface Geist Sans (or Inter, Plus Jakarta Sans, SF Pro Display), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 16px body-lg, 20px subheading, 32px heading, 48px display. Tracking -0.03em at display, 0.04em at caps. The type system projects surgical reliability and developer ergonomics. The sans-serif voice is neutral, modern, and uncluttered, preventing cognitive fatigue on dense technical pages. The monospace accompaniment lends the authentic weight of a command-line environment; Geist or Inter combined with JetBrains Mono provide an exact drop-in implementation.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 32px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Elevation is purely structural and optical rather than skeuomorphic. Depth is achieved through hairline borders (#1b2231) boxing surface layers (#0d111a) atop the void (#07090e). A singular diffuse atmospheric coral bloom emerges behind the lower-right edge of the code card to ground the split layout.
IMAGERY
No photographic imagery is present; the interface relies completely on functional UI artifacts as visual substance. Code editors, terminal output, and technical telemetry metrics serve as the primary visual illustrations. Any graphic addition must take the form of clean vector icons or monospace ASCII motifs.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone headline paired with a glowing terminal card: 'Deploy your AI workloads.' in crisp white directly atop 'Scale without limits.' in saturated coral, anchored by an ambient coral underglow beneath the live CLI pane.
MUST
- Use uppercase tracking (0.08em) with monospace font exclusively for metadata, terminal labels, and section pre-headers.
- Limit the primary coral (#ff5c58) to focal points: headline emphasis, primary CTA, and active indicators.
- Separate sections with 1px hairlines colored #1b2231 rather than arbitrary drop shadows.
- Pair live green status indicators (#22c55e) with operational health metrics only.
AVOID
- Never use soft, diffuse drop shadows; depth is strictly managed via borders and subtle glow blooms.
- Do not render primary paragraphs or navigational links in pure white; reserve #ffffff for headlines and high-contrast labels.
- Avoid pill radius on buttons; preserve the technical feel with an 8px radius.
- Never replace monospace telemetry figures with proportional sans-serif fonts.
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 中尝试 
