Design a dark-mode abstract background artwork: an illuminated solitary journey across vast stellar particle streams and deep cosmic knowledge.
LAYOUT
The hero layout uses a wide 1360px container with an asymmetric two-column balance. The top edge houses a discreet header with centered navigation and right-aligned trial action. The primary viewport split reserves the left 45% for a vertical stack of eyebrow, massive 3-line headline, body copy, dual CTAs, and community proof, while the right 55% unfolds the cinematic illustrated cosmic sweep. A quiet three-item feature row anchors the lower right quadrant.
PALETTE (use these exact hex values)
- #040814 — Cosmic Void: Deepest canvas background behind all imagery and text layout
- #0d1b2a — Nebula Slate: Midground ambient background glow blending photographic elements into dark canvas
- #e59f6b — Solar Filament: Eyebrow text and hero emphasis phrase providing warm cosmic contrast
- #0ea5e9 — Bioluminescent Cyan: Primary action gradient origin, active particle highlights, and feature icon strokes
- #8b5cf6 — Stellar Violet: Primary action gradient destination and ambient field luminescence
- linear-gradient(90deg, #0284c7 0%, #8b5cf6 100%) — Action Stream Gradient: Solid fill for high-intent pill buttons in nav and hero
- #f8fafc — Starlight White: Display headlines and primary navigation labels
- #94a3b8 — Dust Muted: Body paragraphs, avatar counter, and secondary metadata descriptions
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter Display, Geist, DM Sans), weights 400/500/600. Sizes 11px caption, 13px body-sm, 15px body, 16px heading, 18px body-lg, 68px display. Tracking -0.03em at display, 0.15em at uppercase caption. The typographic tone is contemplative, visionary, and intellectually disciplined. Plus Jakarta Sans (or Inter Display) delivers crisp modernist legibility through geometric oval curves and clean terminals that resist sci-fi novelty cliches. Generous display leading and wide uppercase tracking in the eyebrow create the feeling of wide-open mental horizons.
GEOMETRY & SPACING
Corner radii — cards 16px, links 9999px, inputs 9999px, buttons 9999px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1360px container, airy density.
DEPTH
Depth is communicated purely through optical luminance and atmospheric perspective rather than traditional drop shadows. The deep void background acts as ground zero, over which translucent particle dust and light fields layer organically beneath crisp high-contrast foreground typography. Interactive buttons float via sharp color contrast and subtle ambient glow rather than hard-edged elevation planes.
IMAGERY
The imagery language centers on celestial human exploration, featuring a silhouetted figure reading a glowing device atop a rugged crag. Dynamic, sweeping filaments of gold, cyan, and violet stardust curve dramatically upward into deep space. Synthetic 3D renders, generic corporate photography, or daylit natural scenery would completely break the aspirational, introspective brand atmosphere.
SIGNATURE DETAIL — the thing that makes this design itself
The design's signature element is the luminous dual-stream particle field (radiant gold meeting electric cyan) arcing past a solitary reader on a dark precipice, mirrored typographically by splitting the headline into cool white and warm bronze. To use it properly, ensure the physical illumination within the artwork reflects directly onto the headline's color stops. It is commonly misused by using indiscriminate rainbow gradients without an anchoring focal silhouette.
MUST
- Use full pill (9999px) border radii for all standalone primary action buttons.
- Render the secondary display clause in warm amber #e59f6b to maintain dual-tone heading hierarchy.
- Blend hero background artwork directly into #040814 canvas using deep feathered radial gradients.
- Keep navigation links unadorned and rendered in muted white with subtle 1px chevrons.
AVOID
- Never introduce rectangular cards with visible borders or drop shadows over the particle field.
- Do not use high-saturation flat colors for action buttons; maintain the blue-to-violet linear gradient.
- Avoid centering hero typography; keep the left column strictly flush left.
- Do not make the secondary action visually dominant over the primary pill button.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 3424:2416. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub