Miatz playground

Pull One Thread

Pull one token thread, see what secretly doesn't move.

Coming to the Build-LabBrowser (JS)Designdes
The Demystify signature

drift is invisible until you tug the token — one slider move outs every component secretly hardcoded, the same silent failure mode that breaks real design systems in production

How it works

What goes in, what comes out

What it does

Learner edits core token values — spacing scale, color primitives, radius — on a live component library rendered from those tokens. Most components ripple instantly, but a few were seeded with hardcoded values instead of token references and silently don't move, mirroring real production drift.

You bring

drag token sliders for spacing, color, and radius; flag every component that failed to update

You get

a live-rendered component grid plus a post-submission diff overlay of token-driven versus hardcoded components and a token-debt score

You control

token set size (12 basic / 40 full scale); 'seed drift' toggle plants 1-5 hardcoded components at random; library size (8-20 components)

Where it's used

Module 'Design Systems an Agent Can Read' L2 demo-to-lab pair

design tokenstoken drifthardcoded valuessingle source of truth

Concepts click when you open the machinery.

Three labs are already live and free — the same hands-on style this playground brings to its module.