aanifowose111

Diff Spec — Testing skill for Claude Code

Testing community

Diff a product's built UI against its DESIGN_SPEC.md — catches drift (tokens missing from CSS, surfaces named in spec but not rendered, type ramps off-spec, etc.).

How to install Diff Spec

Installs to ~/.claude/commands/aanifowose111-discovery-to-ship-multi-agents-diff-spec.md

Terminal
mkdir -p ~/.claude/commands && curl -fsSL https://raw.githubusercontent.com/aanifowose111/discovery-to-ship-multi-agents/HEAD/.claude/commands/diff-spec.md -o ~/.claude/commands/aanifowose111-discovery-to-ship-multi-agents-diff-spec.md

Restart Claude Code, or start a new session, for it to be picked up.

What Diff Spec does


description: Diff a product's built UI against its `DESIGN_SPEC.md` — catches drift (tokens missing from CSS, surfaces named in spec but not rendered, type ramps off-spec, etc.). REPORTS divergence neutrally; does NOT penalize improvements over the spec. User decides per finding whether it's an intentional improvement, an unintended drift, or a fix to make. Per the claude-led design path. argument-hint:

You are about to diff the built UI of one product against its design

Alternatives in Testing

  • Loki Grill — Interrogate a spec with Loki's Devil's-Advocate grill before building, and summarize the hardest questions it 1.1k ★
  • Design QA — Visual QA on an HTML/CSS implementation — checks responsive behavior at mobile/tablet/desktop, design token co 309 ★
  • Toh Framework — Type one sentence, approve once, walk away — Toh Framework installs an AI build department (14 commands, 8 age 94 ★

Full documentation available on GitHub

View Source Repository