Design a dark-mode abstract background artwork: deep-jungle obsidian illuminated by bioluminescent chartreuse particles and disciplined monospace typography for generative intelligence.
LAYOUT
The hero layout follows an asymmetric two-part split: the left 45% accommodates structured typography, button actions, and trust annotations, while the right 55% is dominated by the monumental bio-cybernetic artwork that bleeds into the edges. Top navigation is pinned cleanly at the ceiling, and the base of the hero is anchored by an evenly balanced 4-column feature metadata row.
PALETTE (use these exact hex values)
- #040D0C — Obsidian Canopy: Primary background canvas absorbing light across the entire viewport
- #0A1A17 — Deep Jungle Teal: Subtle container fill for secondary actions and background vignettes
- #9EFE37 — Electric Chartreuse: High-visibility primary action button background, key spark accents, and focus states
- #2EEA78 — Bioluminescent Green: Emissive particle flares, icon strokes, and ambient point-cloud lighting
- #EEFCF5 — Mint White: Display title and prominent headlines for maximum legibility over dark backdrop
- #7E9F93 — Sage Mist: Body paragraphs, navigation links, and feature card descriptions
- #194437 — Emerald Wireframe: Hairline borders for secondary interactive pills and icon outlines
TYPOGRAPHY
Typeface Space Mono (or JetBrains Mono, DM Mono, Pitch Sans), weights 400/700. Sizes 11px caption, 13px body-sm, 15px body, 18px subheading, 56px display. Tracking 0.04em at body, 0.08em at eyebrow, -0.01em at display. The entire composition speaks in a calibrated, scientific monospace tongue reminiscent of machine learning terminal interfaces and genomics instrumentation. It feels technical, objective, and synthetic without feeling crude, balanced by the organic elegance of the imagery. JetBrains Mono or Space Mono serve as exact functional substitutes.
GEOMETRY & SPACING
Corner radii — cards 0px, links 999px, inputs 10px, buttons 10px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is created entirely through optical bioluminescence and optical layering rather than drop shadows. Luminous green light casts out from the 3D particle cloud and behind typography, treating the deep canvas as an atmospheric fog where closer elements emit light into the foreground.
IMAGERY
The imagery fuses volumetric LiDAR/point-cloud green wireframes (a human bust) seamlessly with deep-jungle macro vegetation (monstera leaves, dewy tropical shoots). Floating spore-like green particles bridge the graphic UI layer and the biological subject. Any generic stock corporate 2D photography or flat cartoon illustrations would immediately dismantle the atmosphere.
SIGNATURE DETAIL — the thing that makes this design itself
The symbiotic integration of lush, glossy tropical foliage with a radiant neon point-cloud human profile, tied together by floating luminous chartreuse particles that drift directly over the monospace type. It is misused when treated as a simple green gradient backdrop rather than a true volumetric scene where UI elements sit within the illuminated space.
MUST
- Reserve solid #9EFE37 exclusively for the primary CTA button and singular data-point accents.
- Render all textual UI in clean, uniform monospace type with generous horizontal tracking.
- Blend hero imagery smoothly into the deep #040D0C background using feathered opacity gradients.
- Use 1px borders colored in subtle emerald tones (#194437) rather than neutral gray.
AVOID
- Do not introduce standard sans-serif fonts; mixing non-monospace body type breaks the code aesthetic.
- Never apply high-contrast white borders around secondary buttons or cards.
- Do not use solid bright green on large background cards; keep it strictly for light emission.
- Never place harsh hard edges on images; always feather them into the #040D0C canvas.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 3408:2416. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试