Spec Kit
Specs and PRDs are standalone HTML documents on the Strata system: one self-contained stylesheet (fonts embedded, tokens compiled, light and dark), a documented structure, and a closed block vocabulary. A spec renders anywhere with zero network, including sandboxes that block external fetches.
The reference spec
Every block, rendered. Open full screen
Authoring
Run the /prdcommand in the repo. It gathers the substance, structures it on the kit, and writes the standalone HTML for you.
Copy the skeleton from the authoring contract, paste all of strata-spec.css into its <style> tag, and compose from the blocks below.
The block vocabulary
| Block | Classes | Use for |
|---|---|---|
| TL;DR | .tldr | The mandatory summary card right after the hero |
| Section header | section > h2 + .num | Numbered sections (01 · Context) |
| Callout | .callout (.note .info .warn .success) | Decisions, constraints, risks, wins |
| Pull quote | .pullquote | One line worth enlarging |
| Pill | .pill (.purple .blue .green .peach) | Inline status chips |
| Table | .tbl-wrap > table | Comparisons and matrices, mono headers built in |
| Anti-list | .antilist | Explicit rejections with the reason |
| Phase card | .phase + .accept | Rollout phases with acceptance criteria |
| Concept | .concept | Definitions of core terms |
| Checklist | .checklist | Open questions and launch gates |
| Metrics | .metrics > .metric | Headline numbers: targets, baselines, results |
| TOC rail | aside + .group headers | Grouped section nav; long specs grow more groups |
| Component veneer | .spec-btn .spec-badge .spec-alert .spec-input .spec-chat | Real product UI as static, pixel-faithful renderings of @layers/ui |
The blocks are the starter vocabulary, not a boundary. A spec may invent whatever presents its content best (charts, wireframes, mockups, testimonials) as long as the invention obeys the style law: kit tokens for every color, the mono label recipe for ALL-CAPS labels, hairlines and the 8px grid. The contract's Beyond the blocks section and the reference spec's section 05 show how.
Files
- /spec/strata-spec.css: the kit, one inlinable file
- /docs/specs: the authoring contract (raw at /docs/specs.md)
- /spec/demo.html: the rendered reference