Liveblocks

Reference it for

• A pure-black dark-mode page (#000 background — not a charcoal, the actual black). Riskier than #0A0A0A or #171717, but stronger when it works.
• Translucent-white overlays for raised cards (rgba(253, 252, 252, 0.13)). The cheapest way to build depth on a black page without compromising the canvas.
• Suisse + JetBrains Mono as the typography pairing — Suisse (any cut) is the developer-tool font of the era, JetBrains Mono is the dominant code face.
• Hand-drawn annotation overlays on product screenshots ("Your app with Liveblocks" in handwritten script, with a hand-drawn arrow pointing into the UI). Adds human warmth to an otherwise system-built page.
• A magenta ambient glow behind the hero product card — single saturated colour moment, used purely as light source not as fill.
• Radix UI (or any headless-component library) as the basis for both the product AND the marketing site, so the marketing-site dropdowns/popovers feel like the actual app rather than like marketing-grade approximations.
• Centred-typography hero without product UI above the fold — the product card sits below the hero copy with breathing room. Counter-pattern to the asymmetric Plain/Cursor heroes.
• A dual-CTA hero pair: "Get started for free" (solid white pill on black) + "Install with AI ⌄" (outline pill with dropdown). The "Install with AI" framing is a 2026-specific moment worth noting.

Do not copy

• The Suisse face — Swiss Typefaces, licensed, not bundled. Substitute with Inter or another humanist sans.
• The exact pure-black canvas without earning it — most brands need at least a hint of grey to soften.
• The magenta hero glow specifically — Liveblocks-coded.
• Hand-drawn annotation overlays on every product screenshot — works once at the hero, repeated everywhere reads as twee.
• The 58-keyframe Radix dump unless the project genuinely uses Radix for components — orphan keyframes are dead CSS.
• "Install with AI" CTAs unless the product has an MCP server or similar AI-installation flow.
• The 33-image-request network bill if the brand can ship the same hero impression with fewer photographs.