Design a dark-mode website section: neon-tinted deep ocean glass floating in a luminescent cybernetic data room.
LAYOUT
Asymmetric two-column split within a 1280px centered wrapper. The left column commands the eye with stacked eyebrow, massive three-line headline, supportive paragraph, and twin CTA buttons; the right hosts an interactive 3D prospect intelligence engine visualization atop a horizontal 5-stage pipeline track.
PALETTE (use these exact hex values)
- #030617 — Void Canvas: Deepest background base layer under all hero content
- #091236 — Midnight Indigo: Atmospheric deep navy backdrop gradient and card fills
- #2563EB — Electric Blue: Primary interactive button fill and pipeline accent line
- #38BDF8 — Neon Cyan: Glow highlights, second half of gradient heading, circuit wires
- #A78BFA — Lavender Glow: Gradient start on display text and cube emission core
- #FFFFFF — Text Primary: Main headlines, active navigation items, prominent badges
- #94A3B8 — Text Secondary: Body copy, inactive nav links, secondary metric descriptions
- #475569 — Text Muted: Trust bar label, timestamps, faint metadata labels
- #1E293B — Glass Border: Subtle edge reflection on frosted dark glass cards
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, Outfit, SF Pro Display), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 20px subheading, 32px heading, 68px display. Tracking -0.03em on display, 0.05em on micro-caps. Clean, authoritative, and computational. Plus Jakarta Sans lends a contemporary technical precision with geometric circular counters that balance cold engineering with consumer-grade SaaS polish.
GEOMETRY & SPACING
Corner radii — cards 16px, links 6px, inputs 10px, buttons 10px. Spacing on a 8px unit, 24px gaps, 100px between sections, 1240px container, comfortable density.
DEPTH
Depth is created via luminous lighting rather than traditional dark dropshadows. Floating glass planes cast radiant cyan (#38BDF8) and violet (#818CF8) specular glows onto the dark surfaces beneath them, separated by subtle 1px border strokes with varying opacities.
IMAGERY
Features bespoke 3D isometric glass art: an illuminated transparent crystal cube housing a glowing four-pointed spark motif, resting on beveled metallic pedestals. Avoid flat vector illustrations, stock photography of humans in offices, or cartoonish UI icons.
SIGNATURE DETAIL — the thing that makes this design itself
The glowing two-tone text gradient ('prospects') paired directly with the radiant glass isometric data cube that anchors the right viewport.
MUST
- Use deep midnight blue (#030617) as the canvas to allow emissive neon glows to stand out.
- Apply linear gradient (lavender to cyan) exclusively to high-impact keywords in the main display title.
- Pair semi-transparent glass cards with 1px light-catching border highlights on the top and left edges.
- Keep typography crisp, strictly modern sans-serif with negative letter tracking on headings over 40px.
AVOID
- Do not use warm yellow, orange, or green base canvases; keep palette strictly cold indigo and cyan.
- Do not drop opaque flat grey or solid white cards into the composition.
- Do not use heavy, chunky drop shadows; use diffused radial colored blur for elevation.
- Do not clutter headings with multiple font families; stick to one high-grade geometric sans.
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. Try in DraPub