Run Builder and Reviewer loops to pixel-diff screenshots against reference images.
npx skills add https://github.com/samuelcastro/skills --skill super-ux
Please help me install this Agent Skill. Skill: super-ux Source: https://github.com/samuelcastro/skills/tree/main/super-ux Command: npx skills add https://github.com/samuelcastro/skills --skill super-ux
super-ux eliminates the manual, time-consuming work of checking whether a live UI matches a reference design by repeatedly running a builder-reviewer cycle until screenshots are visually clean.
Use Case example: You maintain a design system and want overnight visual QA across all pages listed in docs/design-loop/targets.md, stopping automatically when the UI matches the committed reference images.
Ask your agent to run /super-ux with a target loop size, for example: "Run /super-ux 8 to iterate design fixes and pixel-diff the app against the reference screenshots until the UI is clean."
High-intent search queries and answers about installing and using this skill.
Automate visual QA by running an iterative Builder and Reviewer loop that captures screenshots and pixel-diffs them against reference images. This cycle applies targeted code fixes and measures pixel diffs until the UI matches the committed reference designs.
Pixel diff screenshot testing with git worktrees works by applying fixes on separate worktrees per role per iteration. This isolates changes, merges results into an aggregate branch, and keeps the Reviewer read-only on source code while measuring visual differences.
Yes, you can run unattended design fidelity iterations across multiple pages listed in docs/design-loop/targets.md. The loop executes N rounds of Builder-Reviewer ping-pong, stopping automatically when screenshots are visually clean or iteration limits are met.
To set up automated UI validation, you need a codebase with docs/design-loop targets, reference PNGs for multiple slugs and languages, a pixel-diff tool outputting percentDelta, and role-specific contracts where the Reviewer only updates docs/design-loop artifacts.
You should avoid automated screenshot testing if your codebase lacks reference PNGs or a pixel-diff tool outputting percentDelta. The process requires docs/design-loop targets and depends on structured YAML findings to halt on clean status or specific halt conditions.
The best way to iterate design fixes is running a Builder-Reviewer cycle that produces structured YAML findings and updates loop state. It applies targeted code fixes, measures pixel diffs against reference images, and halts automatically when the UI is visually clean.
GolferGeekCreate isolated Git worktrees with independent ports and configuration.
seokan-jeongDetect discrepancies between design mockups and implemented UI by category.
NithwinCreate and manage isolated UI component fixtures for visual screenshot testing.
VIethoangnguyenleAutomate web page interaction, testing, and visual validation with a persistent headless Chromium browser.
