skills.rest
xdkp
xdkpCOMMUNITY
Explore all skills by this author →
GitHub

visual-verdict

Compare UI screenshots against reference images and return a strict JSON visual QA verdict.

Updated May 20, 2026
Search Tags:#design validation#screenshot comparison#iterative editing#visual qa#json verdict#ui fidelity
One-click install
npx skills add https://github.com/xdkp/oh-my-claudecode --skill visual-verdict-xdkp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: visual-verdict
Source: https://github.com/xdkp/oh-my-claudecode/tree/main/skills/visual-verdict
Command: npx skills add https://github.com/xdkp/oh-my-claudecode --skill visual-verdict-xdkp

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It solves the problem of subjective visual evaluation by producing a structured, strict JSON verdict for screenshot-to-reference comparisons.

Core Features & Use Cases

  • Deterministic visual QA verdict: Compares a generated screenshot against one or more reference images and returns a pass/revise/fail outcome.
  • Actionable mismatch diagnosis: Produces concrete difference statements and edit suggestions tied to layout, spacing, typography, and styling.
  • Category/style alignment checking: Evaluates whether the screenshot matches the intended UI category/style via a category_match signal.

Quick Start

Use the visual-verdict skill on your latest screenshot and at least one reference image to obtain a JSON verdict and next-step edit guidance.

Frequently Asked Questions about visual-verdict

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I get structured visual QA pass/fail results for UI screenshot comparisons?▼

Structured visual QA pass/fail results require comparing a generated UI screenshot against reference images to emit a strict JSON verdict. This process targets UI fidelity review by evaluating layout, spacing, typography, and component styling across iterative edit cycles.

What is the best way to automate UI fidelity review during iterative screenshot editing?▼

Automating UI fidelity review involves passing a generated screenshot and reference images to generate a JSON verdict. This yields actionable mismatch diagnosis with concrete difference statements and edit suggestions tied to visual categories.

Does visual QA validation require specific inputs to check layout and typography against a reference image?▼

Visual QA validation requires specific inputs: validating reference_images[] and a generated_screenshot. It then evaluates category and style alignment, returning a category_match signal alongside mismatch diagnosis for layout and typography.

What details are included in a JSON verdict for screenshot comparison?▼

A JSON verdict for screenshot comparison includes score, verdict, category_match, differences, suggestions, and concise reasoning. This structured output provides strict pass/revise/fail guidance for UI fidelity evaluation.

Why does my screenshot comparison return a revise verdict instead of a pass?▼

A revise verdict indicates the generated screenshot contains visual mismatches in layout, spacing, or component styling compared to the reference images. The JSON output provides specific differences and actionable edit suggestions to resolve these discrepancies.

Related Skills

Explore More Design & Creative Skills→
gtpgg1013gtpgg1013

visual-verdict

Compare generated UI screenshots with reference images to produce a deterministic JSON verdict.

Community
Intermediate
Hyeonjun0527Hyeonjun0527
1

visual-verdict

Compare UI screenshots with reference images and output a deterministic JSON verdict.

Community
Advanced
OliverOuyangOliverOuyang
1

visual-verdict

Compare UI screenshots to reference images and output a JSON pass/fail verdict.

Community
Intermediate
tuandzungtuandzung

visual-verdict

Compare UI screenshots with reference images and generate a JSON verdict.

Community
Advanced