skills.rest
mostafasudo
mostafasudoCOMMUNITY
Explore all skills by this author →
Website𝕏@mostafasudoGitHub

design-review

Audit source code for visual inconsistencies, spacing, and hierarchy issues.

3|Updated Oct 12, 2025
Search Tags:#design review#visual QA#design polish#source code audit#AI-based auditing
One-click install
npx skills add https://github.com/mostafasudo/warpy --skill design-review-mostafasudo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/mostafasudo/warpy/tree/main/.codex/skills/gstack/design-review
Command: npx skills add https://github.com/mostafasudo/warpy --skill design-review-mostafasudo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Bash, Read, Write, Edit, Glob, Grep, AskUserQuestion, WebSearch, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses visual inconsistencies, spacing issues, hierarchy problems, AI slop patterns, and slow interactions in designs. It iteratively fixes issues in source code and re-verifies with before/after screenshots.

Core Features & Use Cases

  • Visual Audit: Identifies visual inconsistencies, spacing, and hierarchy issues.
  • Iterative Fixes: Commits each fix atomically in source code and re-verifies with screenshots.
  • Plan-Mode Review: Supports plan-mode design review before implementation.
  • Use Case: Use this Skill to "audit the design", "visual QA", or when seeking design polish.

Quick Start

Invoke the design-review skill to start a design audit.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I audit visual design inconsistencies in source code?▼

Visual design audit involves detecting inconsistencies, poor spacing, and bad hierarchy in source code. This skill utilizes AI to iteratively identify and fix these visual issues, re-verifying results with before and after screenshots.

What is AI-based visual QA and how does it work?▼

AI-based visual QA detects design inconsistencies, poor spacing, and bad hierarchy in source code. It commits iterative fixes atomically and re-verifies results with before and after screenshots to ensure visual consistency.

How do I fix spacing and hierarchy issues in my UI source code?▼

Fix spacing and hierarchy issues by running an AI-based audit on your source code. This skill detects visual inconsistencies and iteratively commits atomic fixes, re-verifying the design polish with before and after screenshots.

Do I need to grant source code access for an automated design review?▼

Yes, an automated design review requires source code access and script execution permissions to apply automated fixes. The skill directly reads and edits code to resolve visual inconsistencies and ensure design polish.

Can I review design polish in plan-mode before implementation?▼

Yes, plan-mode design review is supported before implementation. This allows you to evaluate visual consistency, spacing, and hierarchy issues in your source code without immediately applying the automated fixes.

What is the best way to ensure visual consistency across a codebase?▼

The best way to ensure visual consistency is through AI-based auditing that iteratively detects and fixes source code issues. This skill commits atomic corrections for spacing and hierarchy problems, verifying visual quality with screenshots.

Related Skills

Explore More Software Engineering Skills→
foeriafoeria

web-design-reviewer

Detect responsive, accessibility, and visual consistency issues in websites.

Community
Advanced
imonmiimonmi

design-review

Audit live sites for visual issues and fix them with atomic commits.

Community
Advanced
outfitter-devoutfitter-dev
28

code-review

Automate pre-commit code reviews using structured checklists for quality assurance.

Official
Advanced
chiruu12chiruu12
1

design-review

Automate visual design QA and fix UI issues in codebases.

Community
Advanced