Design a dark-mode website section: developer-grade healthtech interface balancing sterile lab light with deep obsidian telemetry and pine-green accents.
LAYOUT
The view is split horizontally into two major bands: a top two-column light CTA zone and a multi-column deep obsidian footer. In the upper zone, high-impact marketing typography and actions occupy the left column while an API code terminal occupies the right. The lower zone spans six organized columns (brand identity, four categorical link stacks, and a newsletter/status column), concluding with a full-width bottom copyright and legal bar.
PALETTE (use these exact hex values)
- #F4F5F7 — Light Canvas: Background for the upper CTA conversion banner and light hero elements
- #071317 — Obsidian Slate: Base canvas for the entire footer section and terminal card border context
- #0D1B20 — Terminal Surface: Background container for the interactive API snippet card
- #0F2228 — Dark Field Surface: Surface for the newsletter text field and social icon buttons
- #157358 — Pine Emerald: Primary conversion button on light canvas and emphasized headline phrase
- #40BA97 — Mint Glint: Newsletter subscribe button, live status dot, and active tab indicator
- #0C171C — Deep Onyx: Primary headline typography on the light CTA canvas
- #FFFFFF — Pure White: Primary headings, active tabs, and logo mark in dark areas
- #7E8E95 — Slate Muted: Subtitles, inactive nav links, footer credits, and code comments
- #542D19 — Badge Amber: Background fill for the tiny hiring pill in the company nav column
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, DM Sans, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 20px subheading, 32px heading, 44px display. Tracking -0.03em for display, 0.05em for uppercase pills. The voice is clinically precise, modern, and unapologetically engineered for technical healthcare buyers. Plus Jakarta Sans provides crisp geometry with friendly modern terminals, avoiding the sterile clinical feeling of standard Arial or Helvetica. Monospace annotations reinforce developer credibility, conveying enterprise stability without enterprise bloat.
GEOMETRY & SPACING
Corner radii — cards 16px, links 999px, inputs 8px, buttons 8px. Spacing on a 8px unit, 32px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is flattened and structural rather than atmospheric. The interface uses solid color contrasts (light canvas abutting deep dark canvas) and 1px crisp borders (#15252C) rather than heavy drop shadows to define surfaces. The single exception is a faint, ultra-diffused dark blur beneath the terminal card to elevate it slightly above the light deck.
IMAGERY
No photographic imagery is present. Instead, developer utility is represented via an authentic code terminal card displaying real cURL queries and REST API status badges. Trust is established through minimal vector checkmarks beside compliance tokens (HIPAA, EHR).
MUST
- Use pine green (#157358) deliberately for the single highest-value noun in the headline and primary CTA.
- Maintain high-contrast monospace code styling using syntax highlights in mint, gold, and white against deep teal.
- Pair uppercase tracked section kickers (11px, 0.08em tracking) with green status dots for developer-oriented metadata.
- Keep footer column headers in 11px uppercase bold with generous letter-spacing to organize dense navigation.
AVOID
- Never use generic cobalt blue or high-saturation electric purple; stick strictly to pine and mint teal spectrums.
- Do not add drop shadows to footer cards or buttons; preserve the clean flat-stroke architectural aesthetic.
- Avoid mixed alignment in the CTA: keep copy left-aligned with direct eye-level parity to the code preview box.
- Do not use border radii larger than 8px for standard interactive buttons or inputs.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1792:1024. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub