skills.rest
gaaschk
gaaschkCOMMUNITY
Explore all skills by this author →
GitHub

design-review

Audit live site visuals for typography, spacing, color, and hierarchy issues.

Updated Feb 24, 2026
Search Tags:#typography#design#spacing#design-review#color-contrast#ui-polish#visual-audit
One-click install
npx skills add https://github.com/gaaschk/gaasch-family --skill design-review-gaaschk
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/gaaschk/gaasch-family/tree/main/.claude/skills/gstack/design-review
Command: npx skills add https://github.com/gaaschk/gaasch-family --skill design-review-gaaschk

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Skill helps teams audit live site visuals, identify inconsistencies in typography, spacing, color, and hierarchy, and iteratively fix issues with atomically applied changes and before/after verification to maintain a polished UI.

Core Features & Use Cases

  • Visual QA across pages to catch typographic rhythm, spacing gaps, color contrast, and information density issues.
  • Plan-mode design review for pre-implementation polish, enabling design decisions before coding starts.
  • Iterative fixes with atomic commits and automated verification to ensure each change improves consistency and preserves design system constraints.

Quick Start

Provide a live URL and request a comprehensive visual audit with fixes and verification.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I audit live site visuals for typography and spacing inconsistencies?▼

A visual audit identifies typographic rhythm, spacing gaps, color contrast, and information density issues across live site pages. It checks visual hierarchy and design-system alignment to catch UI inconsistencies before or after implementation.

Can I review UI polish and design decisions before coding starts?▼

Yes, the plan-mode option enables pre-implementation visual review to evaluate and adjust UI polish before coding starts. It surfaces typography, spacing, and color hierarchy issues early, allowing design decisions to be finalized prior to development.

How do I fix color contrast and visual hierarchy issues with before and after verification?▼

The skill applies atomic fixes to color contrast and hierarchy issues, performing automated visual verification before and after each change. This iterative process ensures every adjustment improves consistency while preserving design system constraints.

Does the visual audit enforce design-system alignment when proposing UI fixes?▼

Yes, the visual audit enforces design-system alignment by reporting actionable changes that maintain established constraints. It ensures typography, spacing, and color fixes align with the existing design system before applying atomic updates.

What is the best way to perform a visual QA audit across multiple pages?▼

The best way is applying the analysis to a target URL and its in-scope pages, catching typographic rhythm, spacing gaps, and color contrast issues. The audit proposes atomic fixes with before and after verification to maintain polished UI.

Related Skills

Explore More Design & Creative Skills→
lendtrainlendtrain
4

design-review

Audit live websites for typography, spacing, color contrast, and interactive states.

Community
Advanced
stayconnectquickstayconnectquick

design-review

Audits UI spacing, typography and interaction inconsistencies in live sites and commits atomic fixes with before/after screenshots.

Community
Advanced
modu-aimodu-ai
4

moai-domain-brand-design

Extract brand design tokens from visual-identity.md and enforce WCAG 2.1 AA accessibility.

Official
Advanced
maplin-comaplin-co

accessibility-audit

Audit UI components and web pages for WCAG 2.1/2.2 accessibility compliance.

Official
Intermediate