design-review

Detect visual inconsistencies in web interfaces and implement source code fixes.

11|2|Updated Mar 31, 2026
One-click install
npx skills add https://github.com/ajsai47/holyclaude --skill design-review-ajsai47
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/ajsai47/holyclaude/tree/main/skills/team/design-review
Command: npx skills add https://github.com/ajsai47/holyclaude --skill design-review-ajsai47

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Manual visual quality assurance for web interfaces is slow, inconsistent, and often misses subtle issues like spacing mismatches, hierarchy flaws, generic AI-generated UI patterns, and slow interactions that degrade user experience. This skill automates the entire process from detection to verified fix.

Core Features & Use Cases

  • Automated Visual Issue Detection: Scans live web pages to find spacing inconsistencies, typography hierarchy problems, "AI slop" UI patterns, and underperforming interactions.
  • Iterative Source Code Fixes: Resolves identified issues directly in your project's code, with each fix committed atomically for easy rollback and clear change tracking.
  • Before/After Verification: Uses screenshots to confirm every fix matches design intent and introduces no regressions.
  • Use Case: If you're preparing a customer-facing dashboard for launch, run this skill to catch misaligned buttons, inconsistent font weights, and laggy hover states that would harm first impressions.

Quick Start

Ask the AI to run a design review on your live site at https://your-app.com to identify and fix all visual inconsistencies.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I automate visual QA for my web application before launch?

Automated visual QA detects spacing inconsistencies, typography hierarchy flaws, and UI pattern issues on live web pages, applies source code fixes, and verifies them with before/after screenshots to ensure pre-launch polish.

Can I check my live web frontend for design system compliance issues?

Design system compliance checks scan live web interfaces to find visual inconsistencies and hierarchy flaws, resolving them directly in the code with atomic commits for clear tracking and easy rollback across any stack.

How do I fix AI-generated UI patterns and spacing errors automatically?

Fixing AI-generated UI patterns and spacing errors involves scanning live web pages to detect issues, implementing iterative source code fixes, and verifying visual changes through automated screenshots to prevent regressions.

What is the best way to verify UI visual fixes without introducing regressions?

Verifying UI visual fixes without regressions requires capturing before and after screenshots to confirm every applied code change matches design intent and introduces no new visual inconsistencies.

Does automated design review work with any frontend stack?

Automated design review works across any frontend stack by scanning live web applications to perform visual audits, apply code fixes, and verify results independently of the underlying framework.

Why does my post-implementation visual audit miss subtle UI hierarchy flaws?

Manual visual audits often miss subtle hierarchy flaws and spacing mismatches because they are slow and inconsistent, whereas automated visual QA scans live pages to detect and resolve these issues systematically.