Design a light-mode website section: precision aviation workflow automation framed by organic cobalt particulate dynamics and dual-surface telemetry cards.
LAYOUT
Asymmetric two-column split within a 1280px container. The left 45% houses the typographic lockup: 56px headline, paragraph description, CTA button pair, and assurance checklist. The right 55% is occupied by the generative particulate explosion, overlaid cleanly by the dual telemetry mockups.
PALETTE (use these exact hex values)
- #FFFFFF — Canvas White: Pristine background surface maintaining high contrast against particulate artwork and typography.
- #1264E8 — Cobalt Blue: Primary action fill, brand accent text, and dominant particle wash tint.
- #0F172A — Deep Midnight: Primary headings, heavy display titles, and logo typography.
- #182232 — Telemetry Slate: Background surface for the primary automation rule-builder card.
- #64748B — Muted Slate: Secondary copy, guarantee markers, and inactive navigation links.
- #10B981 — Status Green: Success check icons and verified state dots across executions.
- #E2E8F0 — Border Frost: Subtle borders on secondary CTA, execution card, and trust pills.
- #38BDF8 — Electric Cyan: Trigger and keyword highlighting within the automation code panel.
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, DM Sans, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 18px body-lg, 24px heading, 56px display. Tracking -0.03em at display, -0.01em at body. Plus Jakarta Sans conveys sharp, aerospace-grade precision with humanist warmth, preventing the interface from feeling like cold enterprise software. The tight tracking and heavy weight command authority, while JetBrains Mono provides unambiguous technical legitimacy inside code surfaces.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 4px unit, 20px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is created via overlapping layered surfaces rather than blur-heavy shadows. The base level is the flat canvas, followed by the dark telemetry card, topped by the white execution card carrying an ambient drop shadow of 0 12px 32px rgba(15,23,42,0.08) to float crisply above the artwork.
IMAGERY
A generative particulate cloud resembling aerodynamic cavitation bubbles or fluid mechanics rendered in cobalt, cyan, and subtle amber stipples. Imagery must feel mathematically generated and technical, never like a stock photo or flat vector illustration.
SIGNATURE DETAIL — the thing that makes this design itself
The asymmetric juxtaposition of an organic, high-density point-cloud particle wake colliding directly with a rigid, dark monospace logic block and floating receipt stack.
MUST
- Use electric blue (#1264E8) strategically for key action points and single-word headline emphasis.
- Maintain high optical contrast between the white hero ground and the dark #182232 telemetry card.
- Keep typography tight with negative tracking on display headings (-0.035em).
- Pair monospace code syntax in cards with clean geometric sans-serif for UI chrome.
AVOID
- Do not tint the main canvas background; it must remain pristine #FFFFFF for particle crispness.
- Do not use saturated drop shadows; keep elevation soft and neutral (rgba(15,23,42,0.08)).
- Never tint the secondary CTA button background; keep it pure white with a thin border.
- Do not color the entire headline in blue; highlight only the operative subject word.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1440:896. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
