Design a dark-mode website section: precision telemetry on deep navy steel with vibrant electric cyan and radioactive green pulses.
LAYOUT
The composition follows a strict top-down narrative: a two-column hero section with copy on the left and a dense data console on the right. Directly below, separated by ample breathing room, sits a robust enterprise footer. The footer arranges company identity and three vertical link columns on the left, paired with an email capture form in the rightmost column.
PALETTE (use these exact hex values)
- #040810 — Deep Canvas Void: Primary background canvas creating deep optical depth across hero and footer.
- #0B1320 — Card Surface Slate: Background fill for telemetry dashboard panels and interactive inputs.
- #1E293B — Subtle Surface Border: 1px hairline dividing borders, card contours, and input outlines.
- #38BDF8 — Electric Cyan: Primary brand color, primary CTA fill, line chart strokes, and logo glyphs.
- #22C55E — Phosphor Green: Positive delta percentages, circular telemetry gauges, and status badges.
- #FFFFFF — Pure White: High-impact hero headers, primary labels, and key performance metric values.
- #94A3B8 — Muted Steel Text: Supporting descriptive copy, navigation links, and inactive icons.
- #475569 — Faint Timestamp Gray: Copyright text, footer utility links, and secondary metric labels.
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans,SF Pro Display,Roboto), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 14px body, 16px body-lg, 18px subheading, 24px heading, 48px display. Tracking -0.03em at display, 0 at body. The typographic tone is ultra-precise, rigorous, and engineering-first. Clean, neutral grotesque forms (Inter) project enterprise reliability, while monospace accents evoke automated signals and code. Substitute freely with Plus Jakarta Sans or Roboto, provided tight display tracking (-0.03em) is preserved on heavy headers.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is completely flat and architectural, relying on layered surface tones rather than blurred drop shadows. Containers rise from base level #040810 to #0B1320 cards using crisp 1px borders (#1E293B). Glowing accents, such as the electric cyan sparkline, provide an optical luminance illusion rather than physical elevation.
IMAGERY
No photographic imagery is present; visual authority is conveyed through interactive UI telemetry artifacts and data visualizations. Graphics consist exclusively of SVG-rendered sparklines, radial completion rings, and clean monochromatic icons. Any lifestyle photography or stock imagery of human workers would drastically degrade the technical intelligence vibe.
SIGNATURE DETAIL — the thing that makes this design itself
The integrated telemetry card featuring a circular gauge, sparkline, and embedded API response pane directly juxtaposed with heavy headline copy. It instantly demonstrates industrial capability without abstract claims. Misusing it means turning it into an unreadable static screenshot instead of a crisp, scalable CSS/SVG dashboard component.
MUST
- Use pure electric cyan (#38BDF8) exclusively for primary interactions and key brand elements.
- Pair numeric metrics with explicit unit labels and tiny phosphor green delta indicators.
- Use monospace typefaces strictly for code payloads, raw telemetry, and API endpoints.
- Maintain high contrast between #FFFFFF display headlines and the #040810 midnight background.
AVOID
- Never introduce warm colors like orange, red, or yellow unless indicating a severe failure state.
- Do not drop the dark theme; this visual identity requires a pitch-black canvas.
- Avoid decorative soft drop shadows; rely entirely on 1px crisp borders for depth.
- Do not use non-monospaced fonts inside API payloads or code inspector boxes.
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 
