Design a dark-mode website section: crystalline dark glass floating in deep space, illuminated by neon bioluminescent simulation graphics and precision telemetry.
LAYOUT
The header spans the full max-width with balanced horizontal distribution. Below, the hero splits into an asymmetric two-column section: text hierarchy, dual CTA pills, and proof stat on the left (approx. 40%), balanced by an expansive 3D simulation HUD viewport on the right (approx. 60%). The bottom section settles into a symmetrical 3-column feature grid displaying foundational models, workflows, and risk metrics.
PALETTE (use these exact hex values)
- #050814 — Obsidian Void: Deepest background layer across the entire viewport
- #0d1629 — Subsea Glass: Translucent card container background with backdrop blur
- #2563eb — Bio Blue: Base primary button blue and active component accents
- linear-gradient(90deg, #38bdf8 0%, #c084fc 100%) — Cyan Violet Gradient: Headline emphasis text clip and primary action button fills
- #38bdf8 — Simulation Cyan: Glow trails, particle data nodes, and interactive link highlights
- #10b981 — Active Emerald: Status indicator dot marking active real-time simulation runtime
- #ffffff — Pure Optical White: Primary headings, titles, and active navigation labels
- #94a3b8 — Starlight Muted: Secondary descriptive body copy, metric labels, and inactive meta
TYPOGRAPHY
Typeface Inter (or Geist Sans, SF Pro Display, Plus Jakarta Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 16px body-lg, 18px subheading, 24px heading, 56px display. Tracking -0.03em at display, 0.05em at caps metadata. The typographic tone is authoritative, hyper-technical, and futuristic yet institutional. By utilizing a crisp geometric neo-grotesque (Inter or Geist Sans), the layout achieves the feel of an advanced scientific operating system. If Inter is unavailable, Geist Sans or SF Pro Display serve as exact functional drop-ins.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 999px, buttons 999px. Spacing on a 4px unit, 20px gaps, 64px between sections, 1280px container, comfortable density.
DEPTH
Depth is produced through translucent dark glass surfaces (rgba(13, 22, 41, 0.65)) elevated over deep navy space via layered radial glows. Sharp 1px luminous borders (rgba(255, 255, 255, 0.12)) simulate back-lit crystalline edges instead of conventional heavy drop shadows. Glowing internal elements cast soft colored light onto surrounding glass pedestals.
IMAGERY
Visual assets consist strictly of high-fidelity 3D synthetic simulations: bioluminescent cellular clusters, translucent glass slabs, holographic point clouds, and glowing isometric bar charts. Natural or human lifestyle photography is entirely avoided in favor of clinical, computationally rendered biophysical models.
SIGNATURE DETAIL — the thing that makes this design itself
The standout signature is the bioluminescent organoid suspended over an illuminated glass optical slab within a telemetry HUD frame. This crystallizes the brand promise of 'simulating biology' by presenting life science as pure computational physics. To use it properly, keep the surrounding UI dark and whisper-quiet so the internal neon bioluminescence casts natural rim light onto the interface.
MUST
- Use 999px pill radii strictly for buttons, category tags, and floating HUD badges.
- Apply dual-tone text gradient (cyan to violet) only to the primary subject phrase.
- Encase 3D and graphic elements in translucent glass cards with 1px border highlights.
- Keep typography strictly sans-serif with negative tracking on large display headlines.
AVOID
- Never introduce warm colors like orange, yellow, or red unless signaling critical errors.
- Avoid solid opaque card backgrounds; maintain dark translucent glassmorphism throughout.
- Do not use sharp 0px corners; all cards must feature smooth 16px or 20px radii.
- Do not clutter feature cards with excessive text; limit descriptions to two tight sentences.
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