Relay is a landing page for an AI product that shows the product working rather than a screenshot of it.
The hero is a live demo, and because the shape of the work depends on what you sell, three of them ship. Set activeDemo in src/config.ts to "stream" for a response typing out token by token with a live token count and latency readout, "diff" for a before/after code diff, or "extract" for a source document and the structured fields pulled from it with per-field confidence. All three share the same chrome, so switching is one word and the layout does not change. The readouts are values from your config, not live API calls.
Around it: a model comparison table that is a real table, because comparing context windows means scanning a column. A capability spec sheet with a measured-value column. Three-tier token-based pricing. And an FAQ built on native details elements that works with JavaScript disabled.
The verification gate ships inside the download. Run npm run gate and it installs, typechecks, builds, audits dependencies, serves the site, runs Lighthouse, and runs 13 named browser assertions. The numbers are its current output, not marketing copy, and you can re-run it after you have modified the template, which is when it actually matters.
Key features:
- Lighthouse 100 on performance, accessibility, best practices and SEO, all four.
- Verification gate included. npm run gate reproduces every score on your machine.
- 13 browser assertions: no console errors, no horizontal scroll at any breakpoint, exactly one h1, theme toggle persists across reload, FAQ accordion opens, anchor navigation reaches pricing, skip link visible on keyboard focus, required head tags present, no broken internal anchors, alt text on every image.
- Three swappable hero demos: streaming tokens, code diff, or structured extraction, selected by one word in config.
- Accessible animation: the full response text is in the DOM from the start, reduced motion renders the finished state immediately, and diff signs carry a plus or minus so nothing depends on colour alone.
- Every colour in one file. Rebranding is tokens.css and nothing else.
- Node 22.12 or newer. Deploys anywhere static: Vercel, Netlify, Cloudflare Pages, S3.
