ui-screenshot-review

Analyze UI screenshots for typography, contrast, spacing, layout, and accessibility.

Updated Nov 14, 2025
One-click install
npx skills add https://github.com/automata-network/claude-plugins --skill ui-screenshot-review
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-screenshot-review
Source: https://github.com/automata-network/claude-plugins/tree/main/plugins/frontend-testing/skills/ui-screenshot-reviewer/skills/screenshot-review
Command: npx skills add https://github.com/automata-network/claude-plugins --skill ui-screenshot-review

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams ensure screenshot assets meet pixel-perfect UI standards by providing structured design critiques that pinpoint critical issues and actionable fixes.

Core Features & Use Cases

  • Picky UI/UX critique of typography, color, spacing, layout, and accessibility
  • Regression-aware review with optional baseline comparisons
  • Generates a design review report with evidence and fixes

Quick Start

Provide the path to your screenshot directory to initiate a detailed design review.

Frequently Asked Questions about ui-screenshot-review

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

FAQPage Schema
How do I run a visual QA review on UI screenshots to check for design regressions?▼

Visual QA review of UI screenshots analyzes typography, color contrast, spacing, layout, and accessibility against design guidelines. It produces a structured design review report containing evidence and actionable fixes for pixel-perfect quality.

What is screenshot-based UX analysis and how does it improve accessibility?▼

Screenshot-based UX analysis evaluates UI elements against accessibility standards and design tokens. It identifies contrast, spacing, and typography issues, generating evidence-based reports with actionable fixes to ensure your interface meets a11y requirements.

Can I compare new UI screenshots against a regression baseline?▼

Yes, you can compare new UI screenshots against a regression baseline. The tool operates with or without a baseline, performing regression-aware reviews to pinpoint critical visual deviations and ensure pixel-perfect UI standards are maintained.

Does UI screenshot design review require design tokens to assess color contrast?▼

UI screenshot design review aligns its assessments with design tokens and accessibility standards to evaluate color contrast, typography, and spacing. It ensures outputs meet structured design requirements and generates a report suitable for integration.

What is the best way to automate design critique for pixel-perfect UI standards?▼

The best way to automate design critique for pixel-perfect UI standards is providing a screenshot directory path. The tool delivers a structured design review report with evidence and actionable fixes, suitable for direct integration into your workflow.

When should I not use automated screenshot analysis for visual QA?▼

You should not use automated screenshot analysis for visual QA when you lack a screenshot directory or need interactive functional testing. The tool specifically assesses static visual properties like typography, color contrast, and layout against design guidelines.