Visual Verdict

When you're iterating on UI code and need to know if your generated screenshot actually matches the reference design, this gives you a strict JSON verdict with a 0-100 score, pass/revise/fail status, and concrete differences like "nav spacing too tight" or "button font weight wrong." It's built to plug into an edit loop: you keep revising until the score hits 90+, and the structured output tells you exactly what to fix next instead of eyeballing diffs. The category match flag helps catch when you've drifted into the wrong UI style entirely. Useful when visual fidelity matters and you want deterministic feedback before moving on.

skills.sh installs: 954
GitHub stars: 40.7K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add yeachan-heo/oh-my-claudecode --skill visual-verdict --agent claude-code

Installs into .claude/skills of the current project.

Files

Use this skill to compare generated UI screenshots against one or more reference images and return a strict JSON verdict that can drive the next edit iteration.

<Use_When>

The task includes visual fidelity requirements (layout, spacing, typography, component styling)
You have a generated screenshot and at least one reference image
You need deterministic pass/fail guidance before continuing edits </Use_When>

- `reference_images[]` (one or more image paths) - `generated_screenshot` (current output image) - Optional: `category_hint` (e.g., `hackernews`, `sns-feed`, `dashboard`)

<Output_Contract> Return JSON only with this exact shape:

{
  "score": 0,
  "verdict": "revise",
  "category_match": false,
  "differences": ["..."],
  "suggestions": ["..."],
  "reasoning": "short explanation"
}

SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthly Promote your product hereReach 125k+ visitors monthly