Design Token Enforcer (Claude Skill)

Finds every hard-coded colour, radius, font and layout width, maps it to a semantic token, and adds a guard so the whole UI re-themes from one place.

A scanner (hex, rgb, hsl, named colours, fixed radii, font stacks, layout widths, Tailwind arbitrary colours) that skips token files, var() fallbacks and explicit opt-outs, and exits non-zero so it can run in CI. The playbook checks the token layer first (including colour channels for alpha), replaces literals in order, keeps deliberate neutrals, and verifies with a garish theme swap. Where it comes from: Every page on my site restyles from a single theme record, and this rule is what keeps it that way.

Rebrands, dark-mode leaks, theme switchers and design-system clean-ups.

# Claude Code (personal, all projects)
unzip design-token-enforcer.zip -d ~/.claude/skills/

# Claude Code (one project)
unzip design-token-enforcer.zip -d .claude/skills/

# Claude.ai / Claude desktop
Settings → Capabilities → Skills → Upload skill → choose the zip