Design a dark-mode web interface screen: luminescent neon data streams and crystalline telemetry anchored against deep obsidian glass.
LAYOUT
The screen uses a fixed 240px dark navigation sidebar on the left, flanked by a comprehensive top utility bar with a global search input and user profile. The main content canvas stacks vertically: a rich hero overview on top, followed by a filter toolbar, a four-column grid of KPI sparkline cards, a split two-column section for trends and channel distribution, and a bottom tabular campaign ledger.
PALETTE (use these exact hex values)
- #080d1a — Void Canvas: Deepest canvas background behind all navigation and content containers.
- #0e1626 — Panel Slate: Primary surface fill for data metric cards, charts, and table rows.
- #1e293b — Subtle Border: 1px structural divider lines and card outline strokes.
- #0084ff — Electric Blue: Primary action buttons, active navigation states, and primary spline indicators.
- #00d2ff — Cyan Glow: Sparkline trails, secondary trend curves, and planetary network nodes.
- #a855f7 — Vivid Violet: Secondary chart series lines and segmented donut visualization slices.
- #10b981 — Signal Emerald: Positive delta percentages, active status badges, and channel metrics.
- #f59e0b — Signal Amber: Paused state indicators and direct channel share visual segments.
- #ffffff — Pure White: Primary headings, KPI values, and primary button typography.
- #94a3b8 — Muted Slate: Secondary labels, inactive icons, axis metrics, and subheadings.
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, SF Pro Display, Montserrat), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 13px body, 14px body-lg, 16px subheading, 20px heading, 24px heading-lg, 32px display. Tracking -0.02em at display, 0.01em at caption. The typographic tone is ultra-precise, technical, and executive. Plus Jakarta Sans or Inter provides clean geometric clarity with tight headings and easily readable metadata. Figures and currency values command instant visual weight via bold weights and pure white coloration against muted cool-gray contextual text.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 4px unit, 16px gaps, 24px between sections, 1440px container, comfortable density.
DEPTH
Depth is created entirely through surface luminance shifts rather than heavy drop shadows. The background sits at #080d1a, stepping up to #0e1626 for elevated cards bounded by 1px borders (#1e293b). Floating cards over complex imagery utilize backdrop blur with low-opacity dark tints to maintain crisp legibility.
IMAGERY
Imagery is centered on complex, 3D particle-rendered digital wireframes—specifically the illuminated fiber-optic Earth globe glowing with electric blue and magenta nodes. Photography of people is strictly confined to small circular avatar portraits in top navigation. Clipart, generic corporate vector illustrations, or flat 2D iconography are completely excluded.
SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the dark cybernetic telemetry motif: neon-glowing bezier spline charts and the luminous particle-grid globe layered onto deep slate-navy surfaces. This pairing gives enterprise analytics an aspirational, mission-control feel. It is ruined if charts lose their glowing line treatments or if cards are given opaque white backgrounds.
MUST
- Use solid dark navy #080d1a as the root viewport background with #0e1626 for card surfaces.
- Restrict bright saturated colors strictly to metric lines, status dots, and active controls.
- Keep card stroke outlines razor-thin at 1px using dark slate #1e293b.
- Apply subtle neon drop shadows or glows only to active trend lines and central visual elements.
AVOID
- Do not use true pitch black (#000000) for card surfaces or canvas backgrounds.
- Do not fill large card surfaces with saturated bright colors; reserve saturation for data traces.
- Do not mix rounded pill buttons with sharp rectangular card edges; maintain the 8px to 12px hierarchy.
- Avoid thick, heavy borders exceeding 1px width on panels and table dividers.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1552:3840. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
