Playwright + getComputedStyle()
→ narrative DESIGN.md + tokens.json + screenshots.
The verifiable alternative to manually-written design docs. No catalog. No $39/brand. MIT.
Each extraction ships with: raw-css.json (ground truth), desktop + mobile screenshots, tokens.json, layout analysis, and a 16-section narrative DESIGN.md.
Respect to the VoltAgent team — getdesign.md proved the format. But it's a static, manually-written catalog of 73 brands. Prism extracts any URL in 90 seconds.
| Feature | getdesign.md | Prism |
|---|---|---|
| Extract any URL | 73 pre-written brands | Unlimited · any URL |
| Source of truth | Manually written | getComputedStyle() — pixel-perfect |
| Raw CSS audit | Not shipped | raw-css.json (360 KB for mistral.ai) |
| Visual proof | None | Desktop 1440px + Mobile 390px screenshots |
| Structured tokens | Markdown prose only | tokens.json — import directly in code |
| Component states | Not captured | Hover / focus / pressed via Playwright interaction |
| Page structure skeleton | Not included | §13 — section order + height + layout type |
| Real copy / CTAs | Not included | §14 — h1/h2/h3/nav/CTAs extracted verbatim |
| Re-extract on demand | Static — gets stale | prism update <domain> |
| Completeness score | No confidence signal | 0-100 grade (A/B/C/D) per extraction |
| Price per brand | $39 custom + 2-day wait | Free · MIT · 90 seconds |
No accounts, no API keys, no waiting. Playwright loads the URL, scrapes computed styles, generates everything locally.
Real browser headlessly loads the URL. getComputedStyle() captures every rendered value — not class names, actual pixels. Screenshots at 1440px and 390px.
CSS custom properties (--color-text-*, --color-bg-*) map to semantic roles. OpenType features, variable font axes, translucent borders all surfaced automatically.
16 sections: Visual Theme, Colors, Typography, Components, Layout, Depth, Motion, Do/Don'ts, Responsive, Agent Guide, Page Skeleton, Copy Library, Asset Inventory, Component Templates, CSS Raw Export, Known Gaps.