Design a dark-mode website section: deep obsidian night illuminated by electric chartreuse auroras and high-precision telemetry cards.
LAYOUT
The top half is a balanced split-hero CTA: compelling typographic proposition on the left, interactive/telemetry proof card on the right, backlit by central aurora rays. A crisp horizontal boundary transitions into the bottom footer, structured as an asymmetrical 6-column layout capped with a bottom legal and copyright row.
PALETTE (use these exact hex values)
- #04090e — Void Canvas: Deepest canvas background anchoring the footer and card foundations
- #081418 — Telemetry Surface: Background for dashboard card modules and floating panels
- #162b2b — Border Subtle: 1px hairline borders for cards, inputs, and internal dividers
- #b4f466 — Lime Prime: Primary brand accent, primary CTA gradient start, and live status beacon
- #58e8a2 — Neon Cyan: Primary CTA gradient stop and sparkline highlight tone
- #f1f5f9 — Text Primary: Primary headlines, KPI metric numerals, and high-emphasis links
- #8ba3aa — Text Secondary: Hero description, column links, sub-labels, and metadata
- #7ef196 — Text Accent: Sub-headline highlight text and link accents
TYPOGRAPHY
Typeface Inter Display (or Plus Jakarta Sans, Geist, SF Pro Display), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 14px body, 16px body-lg, 20px subheading, 24px heading, 48px display. Tracking -0.03em at display, 0.05em at caps metadata. Modern enterprise-technical: cool, surgical, and authoritative. Inter or a similar clean grotesque conveys operational efficiency, where tight headline tracking suggests speed and wide-tracked uppercase captions communicate telemetry precision.
GEOMETRY & SPACING
Corner radii — cards 16px, links 999px, inputs 8px, buttons 10px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1200px container, comfortable density.
DEPTH
Elevation is expressed through luminance rather than drop shadows. Translucent dark panels (#081418) layer cleanly over the vertical auroral glow via subtle 1px cyan-slate hairlines (#162b2b), while the brightest elements—the primary buttons—appear visually closest purely through vibrant color emission.
IMAGERY
No photographic lifestyle imagery is present. Visual storytelling is achieved via realistic, high-fidelity UI telemetry mockups, clean vector sparklines, and an ethereal backdrop composed of vertical, blurred lime-green light beams resembling high-speed fiber optics.
SIGNATURE DETAIL — the thing that makes this design itself
The vertical bioluminescent aurora beam behind high-density telemetry widgets. If replicated, ensure the light feels directional (top-to-bottom ray dispersion) and strictly limited to chartreuse/emerald frequencies; turning it into a round fuzzy radial gradient instantly destroys the aesthetic.
MUST
- Use the luminous lime gradient (#b4f466 to #58e8a2) exclusively for high-intent primary actions and live status signals.
- Maintain strict tabular alignments in metric cards with monospace-compatible numerical tracking.
- Pair stark white headline typography with mint-green accented secondary display lines.
- Enclose dense data views inside #081418 panels with razor-thin #162b2b borders.
AVOID
- Do not use warm hues (red, orange, purple); the palette strictly requires cold cyan, emerald, and lime.
- Do not drop heavy, diffused drop shadows under cards; rely on razor hairlines and translucency.
- Do not fill large UI card containers with pure lime; reserve it only for accents and CTA buttons.
- Do not center footer navigation links; maintain rigid left alignment per column.
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 中尝试 
