What is the design-review skill?
The gstack design-review skill is designer's eye QA for a live site. It finds visual inconsistency, spacing issues, hierarchy problems, AI slop patterns and slow interactions, then fixes them in source code, one atomic commit per fix, and re-verifies each with before and after screenshots.
design-review is the audit and repair skill among gstack's design tools, at version 2.0.0. Its description calls it designer's eye QA that finds problems in a built interface and then fixes them, not only a report.
SKILL.md says it iteratively fixes issues in source code, committing each fix atomically and re-verifying with before and after screenshots. Each change can be reviewed, kept or reverted alone.
What it looks for
- Visual inconsistency across screens and components.
- Spacing issues and weak hierarchy.
- AI slop patterns, which the description names as its own class of problem.
- Slow interactions that make a page feel unfinished.
How a fix is handled
- The agent changes the source code itself, because Write and Edit are in its allowed tools.
- Every fix becomes its own atomic commit, so the history shows one change at a time.
- Before and after screenshots confirm the result of each fix.
- It can research references with WebSearch and ask you questions through AskUserQuestion.
Who the design-review skill is for
Best for
- Teams with a live site that looks inconsistent and needs polish.
- Developers who want fixes committed in small, reviewable steps.
- Requests like audit the design, visual QA, check if it looks good or design polish.
Not for
- Plans that are not built yet. SKILL.md sends plan mode review to /plan-design-review.
- Anything other than a built interface, since the skill audits a built interface.
Use it with UiChemy
This skill edits the code of a live site and checks it in screenshots. If that site runs on WordPress, UiChemy Figma to WordPress can turn a design into editable pages first. Click Get Started on uichemy.com. Related pages: critique, polish and fixing accessibility.
How to install gstack Design Review Skill: Visual QA That Fixes Code
git clone --single-branch --depth 1 https://github.com/garrytan/gstack.git ~/.claude/skills/gstack && cd ~/.claude/skills/gstack && ./setupInstall the prerequisites
The README lists Git, Bun v1.0 or newer and a supported agent. On Windows you also need Node.js.
Run the gstack installer
Paste the clone and setup command above. design-review installs with the rest of the collection, so there is no separate step for it.
Select other agents
Setup targets Claude Code by default. Use ./setup --host followed by codex, opencode, cursor, factory, kiro or copilot, or auto to cover every agent it finds.
Invoke it on your site
Run /design-review and point it at your live site. Hosts with prefixed commands, such as Copilot, use the /gstack prefix per the README.
Check that it loaded
Run /design-review against a page with an obvious spacing problem. It should report the issue, change the source, commit that fix alone, and show before and after screenshots of the result.
Key features
- Designer's eye auditThe description frames it as QA with a designer's eye, so the checks target how the interface looks and feels and not only whether it runs.
- Five problem classesIt names visual inconsistency, spacing issues, hierarchy problems, AI slop patterns and slow interactions as the things it finds.
- Fixes in source codeIt iteratively fixes issues in your source code instead of stopping at a list, using Write and Edit alongside Bash, Read, Glob and Grep.
- Atomic commitsEach fix is committed on its own, which keeps the history readable and lets you revert one change without losing the others.
- Before and after screenshotsAfter each fix the skill re-verifies with before and after screenshots, so improvements are shown and not only claimed.
- Live site focusIt targets a live site and works on its visuals. For plan stage review it hands off to /plan-design-review, and SKILL.md draws that line clearly.
- Version 2.0.0The frontmatter marks this skill at version 2.0.0.
- Research and questionsWebSearch and AskUserQuestion are in the allowed tools, so the agent can look up references and ask you before making judgment calls.
- Trigger phrasesTyping visual design audit, design qa or fix design issues loads it, and so do asks such as check if it looks good or design polish.
Frequently asked questions
What is the gstack design-review skill?
It is a visual QA skill in the gstack collection. It audits a live site for inconsistency, spacing, hierarchy, AI slop and slow interactions, fixes them in source code, commits each fix separately and verifies it with screenshots taken before and after.
How do I install design-review?
Install gstack. Run the README clone command into your agent's skills folder and then ./setup. The skill comes with the collection, and the README does not describe an install for a single skill on its own.
Does it only report problems?
No. Unlike a plain audit, it iteratively fixes issues in source code. SKILL.md says it commits each fix atomically and re-verifies with before and after screenshots, so every change has its own record.
How is it different from plan-design-review?
design-review works on a live site after the code exists. SKILL.md points plan mode design review, which happens before implementation, to /plan-design-review, so the two cover different stages. Related page: web design guidelines.
What counts as AI slop?
The description lists AI slop patterns among the problems it finds, next to inconsistency and spacing issues. The description does not define the term, so check the repository's SKILL.md.tmpl for specifics.
Which agents does gstack support?
The README table lists Claude Code at the full tier. Codex CLI, OpenCode, Cursor, Factory Droid, Kiro and GitHub Copilot CLI are experimental, and Slate, OpenClaw, Hermes and GBrain are instruction only.
Which phrases call this skill?
The frontmatter lists visual design audit, design qa and fix design issues. The description adds audit the design, visual QA, check if it looks good and design polish as requests that match it.
What license does gstack use?
The repository and README list the MIT license, and the README calls the collection free software you can fork and improve. That covers using and changing the skill in your own projects.