A contract-first design system
A component is a single YAML contract — surface, slots, events, states, tokens, accessibility obligations. The Wyrding Way projects it into working code for the platforms you choose, and gates their parity in CI. Interaction and geometry are identical by construction, not by convention.
Change the contract and every chosen target regenerates. The drift gate fails the build until they agree — the reference you are reading and the code you are shipping cannot disagree.
Parity gated across 3 selected targets.
identity: name: Button tag: wyrd-button package: wyrd.component.buttontarget-strategy: react: required flutter: required lit: requiredsurface: properties: [variant, is-disabled, is-loading] slots: [label, leading-icon, trailing-icon] events: [press] states: [default, hover, focus-visible, pressed, disabled, loading] tokens: primary: background: color.primary foreground: color.on-primary radius: rounded.mdobligations: accessibility: role: button sdui: status: serializable01
48 components ship ready to use — from Button and Card to a flow editor and a graph viewer — all rendered from your brand tokens. When you author components of your own, the same machinery applies: one contract, projected to the targets you choose.
02
Accessibility scans, localization stress fixtures, WCAG contrast, and cross-stack visual parity fail the build, not the audit.
03
Your identity is a DESIGN.md compiled into W3C tokens. The same components re-skin per brand; our brand never competes with yours.
04
Contracts, tokens, and behavior are machine-readable. Human designers and AI agents work the very same surfaces, under the very same guarantees.
A brand is a DESIGN.md compiled into W3C tokens — an input, not a fork. Watch the same composite re-skin as the tokens change. The contracts underneath never move.
The Wyrding Way
The homage presets demonstrate range, not affiliation — the same contracts wearing four very different DESIGN.md files, each compiled through the real token pipeline. They are clearly labeled and nothing third-party ships with the system.
Every component documents its own anatomy from the contract — slots, tokens, focus, radius. Parity is not a tolerance.
FIG. 1 Button — anatomy TOL. ±0
Every guarantee above runs as a CI gate, and the Button reference is generated from the same contract you just read. Start your inspection there.
Inspect the Button reference