Design a dark-mode abstract background artwork: luminescent generative particle vortex anchoring deep space contrast against razor-sharp geometric typography.
LAYOUT
The screen uses a 100vh hero framework with a persistent single-line header separated by a hair-thin rule. The primary content is split: the left 45% houses the text hierarchy (status indicator, bipartite display heading, description, and primary CTA pill), while the right 55% is reserved for the luminous 3D celestial particle system. Anchoring the bottom is a centered, floating horizontal dock spanning the full container width with five equidistant capability segments.
PALETTE (use these exact hex values)
- #03050a — Deep Void: Root page canvas absorbing light and setting deep infinite contrast behind particles
- #d4ff36 — Acid Chartreuse: Hero display headline highlight, primary CTA button fill, micro-dots, and capability icons
- #ffffff — Pure White: Secondary headline rows, brand mark dots, and high-emphasis interface elements
- #8f9cae — Muted Slate: Hero body copy, capability dock descriptions, and secondary metadata
- #e2389a — Nebula Magenta: Organic spectral particle glow and decorative status pill segment
- #00d4ff — Electric Cyan: Fluid particle streamlines and subtle atmospheric background highlights
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, General Sans, Syne), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 14px body, 14px subheading, 15px body-lg, 72px display. Tracking -0.035em at display, +0.08em at uppercase nav. The typography voice is engineered, clinical, and unapologetically futuristic. Plus Jakarta Sans delivers sharp neo-grotesque clarity with contemporary geometric geometry that cuts cleanly across dense organic particles. Letterforms are packed closely at giant display scale to project confidence, while navigation links are spaced broadly to convey technical precision.
GEOMETRY & SPACING
Corner radii — cards 20px, links 4px, inputs 999px, buttons 999px. Spacing on a 4px unit, 20px gaps, 96px between sections, 1360px container, comfortable density.
DEPTH
Depth is created purely through luminous layering and glass translucency rather than material box shadows. High-energy light emissions from the generative sphere and magenta-cyan particle wave bleed naturally behind frosted surfaces. The bottom dock sits above the void using backdrop-filter blur and a 1px delicate stroke (rgba(255,255,255,0.12)).
IMAGERY
The imagery is high-resolution generative particle physics visualizing world modeling and synthetic space. Dense swarms of bokeh orbs, directional light streaks, and a celestial planetary sphere feature electric cyan, magenta, and solar amber tones. Flat clip art, stock photos of people, or literal computer hardware would instantly break the brand reality.
SIGNATURE DETAIL — the thing that makes this design itself
The signature move is the dual-tone typographic lockup—two lines of vibrant acid chartreuse (#d4ff36) transitioning seamlessly into two lines of pure white (#ffffff)—anchored directly against a massive bioluminescent particle vortex. It creates an instant visual hierarchy that bridges calculated software logic with cosmic data generation.
MUST
- Strictly split the 4-line hero headline between #d4ff36 for the first two lines and #ffffff for the remainder.
- Use pill radius (999px) for all standalone actionable buttons and tag elements.
- Maintain high optical black backdrop to preserve luminous particle vibrance.
- Style dock icons with thin 1.5px stroke weight rendered exclusively in #d4ff36.
AVOID
- Do not introduce solid opaque backgrounds to the bottom feature dock container.
- Do not use saturated blues or greens for text copy; stick to pure white and #8f9cae.
- Avoid boxy square corners on buttons; buttons must always have 999px border-radius.
- Do not obscure the celestial sphere on the right with heavy text or overlapping cards.
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 中尝试