Compare UI screenshots pixel-by-pixel and generate diff reports with JSON output.
npx skills add https://github.com/MadAppGang/magus --skill compare-madappgang
Please help me install this Agent Skill. Skill: compare Source: https://github.com/MadAppGang/magus/tree/main/plugins/designer/skills/compare Command: npx skills add https://github.com/MadAppGang/magus --skill compare-madappgang
This Skill automates the process of comparing UI designs, identifying visual discrepancies between a reference and an implementation, and providing detailed analysis.
Compare the reference image at /path/to/reference.png with the implementation image at /path/to/implementation.png, saving the output to /path/to/output.
High-intent search queries and answers about installing and using this skill.
To compare UI designs pixel-perfectly, this Skill performs deterministic pixel-level comparison between reference and implementation screenshots, generating detailed diff reports and structured JSON outputs. It identifies visual discrepancies across color, typography, spacing, and layout.
Visual regression testing detects unintended UI changes by comparing screenshots. This Skill enhances regression testing by combining deterministic pixel diff matching with AI-driven semantic analysis to categorize and describe visual differences across imagery, content, and states.
Yes, you can automate screenshot testing for design validation. This Skill facilitates automated UI validation by comparing reference and implementation images, generating structured JSON outputs that integrate directly into your quality assurance workflows.
Yes, this pixel diff tool supports semantic UI comparison across multiple states. It leverages AI-driven semantic analysis to evaluate visual discrepancies in typography, layout, imagery, content, and component states beyond basic deterministic pixel matching.
The best way to generate a diff report is providing the reference and implementation image paths. The Skill performs pixel-level comparison and outputs a detailed diff report analyzing color, spacing, and layout discrepancies, alongside structured JSON data.
No external dependencies are required to run UI comparison and design validation. The Skill operates independently using its internal scripts and references to perform deterministic pixel matching and AI-driven semantic analysis on your screenshots.
MadAppGangGenerate UI components from Figma URLs and validate against design fidelity.
codygo-aiValidate JSON schemas against OpenAI, Anthropic, and Gemini rules.
HCMUTE-RTICValidate UI modifications for design system compliance and accessibility via screenshot analysis.
curiositechCapture web page screenshots and analyze them with multimodal AI for visual regression testing.
