skills.rest
INNERJOINT
INNERJOINTCOMMUNITY
Explore all skills by this author →
GitHub

visual-verdict

Compare generated UI screenshots against reference images and emit a strict JSON pass/fail verdict.

Updated Mar 26, 2026
Search Tags:#ui-testing#quality-assurance#screenshot#visual-qa#verdict#pixel-diff#image-compare
One-click install
npx skills add https://github.com/INNERJOINT/HarnessSkills --skill visual-verdict-innerjoint
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: visual-verdict
Source: https://github.com/INNERJOINT/HarnessSkills/tree/main/skills/visual-verdict
Command: npx skills add https://github.com/INNERJOINT/HarnessSkills --skill visual-verdict-innerjoint

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provide a strict, machine-readable verdict for comparing generated UI screenshots to one or more reference images so teams can gate iterative visual edits with deterministic pass/fail guidance.

Core Features & Use Cases

  • Structured JSON Verdict: Produces a fixed JSON output containing score, verdict, category_match, differences, suggestions, and concise reasoning for automated pipelines.
  • Visual Fidelity Checks: Evaluates layout, spacing, typography, colors, and component hierarchy to identify concrete mismatches.
  • Use Cases: Automated visual regression testing for design systems, pre-release screenshot QA for generated UIs, and iterative feedback loops in generative UI workflows.

Quick Start

Run the visual-verdict skill with your generated screenshot and one or more reference images to receive a strict JSON verdict and actionable suggestions.

Frequently Asked Questions about visual-verdict

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

FAQPage Schema
How do I automate visual regression testing for generated UI screenshots?▼

Determine visual QA pass or fail by enforcing a strict 90+ score threshold from the JSON verdict output. Reaching this score gates further visual edits, ensuring generated UIs match reference images before proceeding.

What is structured JSON output for visual QA and why use it?▼

Structured JSON output for visual QA is a fixed schema containing score, verdict, category_match, differences, suggestions, and concise reasoning. It provides deterministic, machine-readable pass/fail guidance for automated UI generation pipelines.

Can I use screenshot image comparison for pre-release UI design system checks?▼

Yes, you can use screenshot image comparison for pre-release UI design system checks. It identifies concrete mismatches in layout, spacing, typography, and colors by evaluating component hierarchy against one or more reference images.

How do I evaluate visual fidelity and identify mismatches in UI generation workflows?▼

Evaluate visual fidelity in UI generation workflows by comparing generated screenshots to reference images. The process identifies concrete mismatches across layout, spacing, typography, colors, and component hierarchy, returning actionable suggestions.

What is the pass threshold for gating iterative visual edits in pixel diff workflows?▼

The pass threshold for gating iterative visual edits in pixel diff workflows is a strict score of 90 or higher. Reaching this threshold ensures generated UI screenshots sufficiently match reference images before further edits.

Related Skills

Explore More Design & Creative Skills→
huyhung9630huyhung9630
1

omc-visual-verdict

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

Community
Intermediate
KYRIE66nbKYRIE66nb

visual-verdict

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

Community
Advanced
zengbaochengzengbaocheng

html-screenshot-image-gen

Generate infographic-style PNG images from HTML templates via browser screenshots.

Community
Intermediate
fy538fy538

visual-qa

Compare rendered image stills against POLISH.md design specifications and generate markdown reports.

Community
Intermediate