Design a dark-mode website section: industrial command-center precision bathed in deep midnight slate, crisp wireframes, and surgical electric cyan accents.
LAYOUT
The section employs an asymmetric two-column split layout across a 1360px max-width container. The left column (roughly 5/12 width) houses the narrative stack: pill badge, high-impact headline, subtitle, three icon-led feature bullets, and dual CTA buttons. The right column (7/12 width) houses the dense simulated telemetry console with internal 2x2 modular sub-cards, anchored at the base by a full-width 4-column feature ribbon.
PALETTE (use these exact hex values)
- #060a10 — Canvas Midnight: Deepest canvas background behind all sections and hero marketing columns
- #0b121c — Console Surface: Background fill for the interactive mock dashboard container and bottom feature dock
- #0f1724 — Card Interior: Background for nested telemetry modules like live feed, timeline, chart, and console
- #162234 — Muted Slate Border: Structural 1px outlines separating modules, cards, and input dropdowns
- #3b82f6 — Electric Cyan: Primary interactive CTAs, active tab underlines, and key accent typography
- linear-gradient(135deg, #38bdf8 0%, #2563eb 100%) — Cyan Glow Gradient: Accent text fill on key headline phrase and primary button gradient surface
- #22c55e — Telemetry Emerald: Pulsing live status pips, health metrics, and successful runtime telemetry markers
- #f1f5f9 — Primary Luminescence: High-contrast headings, main metric integers, and active navigation labels
- #7b8b9e — Muted Spec: Body copy, inactive tabs, timestamp labels, and technical meta descriptions
TYPOGRAPHY
Typeface Inter (or Geist Sans, SF Pro Display, Roboto), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 24px subheading, 48px display. Tracking -0.03em at display, 0 at body. The typography communicates hyper-rational engineering reliability and real-time mission-critical execution. The use of a dense neo-grotesque sans (Inter match) with tight tracking delivers an executive, modern developer-tool persona, while strict monospace accents authenticate the software as genuine infrastructure.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 999px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1360px container, comfortable density.
DEPTH
Depth is created entirely through surface nesting and 1px border luminescence rather than diffuse ambient shadows. The base level 0 canvas (#060a10) sits behind a level 1 dashboard container (#0b121c), within which level 2 data tiles (#0f1724) are etched with delicate 1px outlines (#162234).
IMAGERY
Imagery is purely utilitarian and authentic to robotics: multi-perspective industrial CCTV camera feeds, top-down warehouse LiDAR occupancy grid maps, and real-time bounding boxes around autonomous vehicles. Any whimsical, 3D abstract, or consumer lifestyle photography would immediately break the system.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone headline technique where the final clause ('In production.') is illuminated in an electric cyan gradient, paired directly with a high-density industrial telemetry dashboard containing authentic camera feeds and coordinate maps.
MUST
- Use 1px subtle slate borders (#162234) to delineate cards rather than heavy drop shadows.
- Restrict bright saturated cyan to CTAs, glowing headline text, and interactive focal points.
- Use JetBrains Mono or equivalent monospace type strictly for logs, coordinates, and technical readouts.
- Pair live status dots (6px-8px) in emerald (#22c55e) with a subtle outer glow or opacity ring.
AVOID
- Do not use pure black (#000000); always tint dark backgrounds with deep navy-slate undertones (#060a10).
- Do not apply bright cyan backgrounds to more than one button in a single viewport cluster.
- Do not use decorative illustrations or abstract 3D shapes; stick to authentic machine perception feeds and wireframes.
- Do not make card borders thicker than 1px.
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 中尝试 
