Writes React the way your team already agreed to write it.
Eval suite not run yet
UI & UX
Interface Review
Reviews a screen against real UI rules, not taste.
What it produces
Contrast2.8:1 against 4.5 needed
Spacing3 values off the scale
Focus order2 stops unreachable
Touch targets38px against 44 needed
Type scalematches
every finding cites your token file, not a generic rule
Trigger accuracy
Not measured yet. This skill does not go on sale until its eval suite has been run against it and the number published here.
What we changed
- Reads your token file first, so findings cite your scale rather than a generic one.
- Computes contrast rather than eyeballing it, and shows the ratio and the threshold.
- Separates 'breaks a rule' from 'worth a look', so the list can actually be worked through.
- Checks focus order and touch targets, which most review prompts skip entirely.
- A troubleshooting table for token files it cannot parse.
What it does, on real work
Reviewing a new screen
> review this page against our design system
Eleven findings: four contrast failures with ratios, three off-scale spacings, two unreachable focus stops, two worth a look.
Checking one component
> is this button accessible?
Reported the contrast ratio, the focus ring, and the 38px touch target against the 44px rule.
Explaining a finding
> why is that spacing wrong?
Quoted the scale step it should have used and the one it used instead.
Requirements
- Claude Code 2.0+
- A token or theme file
- macOS, Linux or Windows
Related
Cuts what Claude reads before it starts, without cutting what it knows.
Eval suite not run yet