pencilrebel/roast-my-design-system
11 stars · Last commit 2026-08-16
v4.2.6 · Try it: npx roast-my-design-system · Your AI can write the UI. This makes sure it writes YOUR ui. A health score, per-package scores for monorepos, receipts, fixes ranked by payoff, rules injected via --apply, and .roastignore to scope the scan honestly. Benchmarked against 34 public repos and 10 reputable systems.
README preview
# roast-my-design-system [](https://www.npmjs.com/package/roast-my-design-system) [](LICENSE) ## Your AI can write the UI. This makes sure it writes *your* UI. A free CLI tool (and Claude Code skill) that roasts your repo's design system with real data, then generates the rules that keep your AI agent on-system. Run it on your codebase and get, in about a second: - **A health score you can defend in a meeting.** 0-100, deterministic, benchmarked against Ideal Design System norms, 34 scanned public repos and 10 reputable design systems (Primer, Polaris, Carbon, shadcn/ui…). - **Per-package scores for monorepos.** One blended number hides which package is the problem: `packages/ui` scores 80 while `apps/web` scores 40, and now you can see it. - **The receipts behind it.** Every colour and its near-identical twin, every spacing value, typeface, duplicated or never-imported component, inline style and !important, with real file paths, in one self-contained HTML report you can open, Slack or email. - **The first fixes ranked by payoff.** A "Where to start" list derived from your own numbers: keep the report as the audit, or hand it to Claude as the punch list for the fix. - **Rules that stop the mess coming back.** A generated `design-system-rules.md` for your CLAUDE.md or .cursor/rules: canonical components, your token file, known duplicates to avoid, so your AI agent follows your system instead of guessing at it. `--apply` injects them for you, and every scan checks the rules you already have for stale references: paths that no longer exist, components named canonical that nothing imports anymore. ## Why this exists Your AI agent (Claude, Cursor, Copilot) builds UI by imitating what's already in your repo. If your repo has 112 colours and four Button implementations, your agent guesses which one is canonical, and it picks wrong half the time. That's why AI-generated UI looks *almost-but-not-quite* right. The first step to fixing it is seeing the mess measured.