skills.rest
sanjanb
sanjanbCOMMUNITY
Explore all skills by this author →
GitHub

design-review

Audits live sites for visual inconsistencies and fixes them with atomic commits and before/after screenshots.

1|Updated Jul 23, 2026
Search Tags:#screenshots#design review#design audit#atomic commits#ui polish#gstack#visual qa
One-click install
npx skills add https://github.com/sanjanb/my-agent-harness --skill design-review-sanjanb
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/sanjanb/my-agent-harness/tree/main/skills/gstack-design-review
Command: npx skills add https://github.com/sanjanb/my-agent-harness --skill design-review-sanjanb

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Visual QA of a live site is tedious and subjective: spacing drift, hierarchy problems, AI slop patterns, and slow interactions slip through code review. This Skill gives the agent a designer's eye, finding visual issues and fixing them directly in source code with verifiable before/after evidence. ## Core Features & Use Cases - Visual inconsistency detection: Finds spacing issues, hierarchy problems, AI slop patterns, and slow interactions on a live site. - Iterative fix loop: Fixes each issue in source code, commits atomically, and re-verifies with before/after screenshots. - Proactive triggering: Activates when asked to "audit the design", run "visual QA", or polish the look of a live site; pairs with /plan-design-review for pre-implementation review. - Use Case: After shipping a new landing page, ask the agent to audit the design; it screenshots the page, flags misaligned spacing and weak visual hierarchy, fixes each in code, commits per fix, and shows before/after proof. ## Quick Start Ask the agent to audit the design of the running site and fix any visual inconsistencies it finds.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I run a visual design audit on my live site with an AI agent?▼

Invoke the design-review skill against the running site. It screenshots pages, identifies spacing, hierarchy, and interaction issues, then fixes each in source code with an atomic commit and re-verifies with before/after screenshots.

What is the difference between design-review and plan-design-review?▼

design-review audits and fixes a live, implemented site iteratively. plan-design-review runs in plan mode before implementation, reviewing the design approach before any code is written.

What kinds of visual issues does design review detect?▼

It detects visual inconsistency, spacing problems, hierarchy issues, AI slop patterns, and slow interactions. Each finding is fixed in source code and verified with before/after screenshots rather than just reported.

Does design review work in headless or spawned agent sessions?▼

Yes. In spawned sessions it auto-chooses recommended options without interactive prompts and ends with a completion report. In headless sessions it blocks when a user decision is required, since no human can answer.

When should I not use automated design review?▼

Avoid it for pre-implementation design decisions, where plan-design-review fits better, and when the site cannot be run locally for screenshots, since the fix loop depends on visual re-verification.

Related Skills

Explore More Design & Creative Skills→
Srajangpt1Srajangpt1

write-docs

Generate BrowserOS feature MDX docs from source code and screenshots.

Community
Intermediate
FaeifFaeif

ship

Automate the end-to-end ship workflow from merge to PR creation.

Community
Advanced
agwacomagwacom

avad-design-review

Audits live-site visuals and fixes design inconsistencies with atomic commits.

Official
Advanced
tsenseitsensei
3

design-review

Audit typography, spacing, hierarchy, color, and interaction cues on live sites or prototypes.

Community
Advanced