skills.rest
TimHL5
TimHL5COMMUNITY
Explore all skills by this author →
GitHub

design-review

Audit live websites for spacing, typography, and hierarchy issues.

Updated Mar 21, 2026
Search Tags:#typography#spacing#design-review#visual QA#before-after#live-site
One-click install
npx skills add https://github.com/TimHL5/carousel --skill design-review-timhl5
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/TimHL5/carousel/tree/main/.claude/skills/gstack/design-review
Command: npx skills add https://github.com/TimHL5/carousel --skill design-review-timhl5

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Identify and fix visual inconsistencies, spacing issues, and hierarchy problems on live sites, then verify improvements with before/after checks.

Core Features & Use Cases

  • Visual audit of pages to surface typography, spacing, alignment, and color harmony issues.
  • Iterative fix workflow with atomic commits and before/after verification to ensure traceable design polish.
  • Plan-design-review mode for pre-implementation audits to guide UI improvements before coding.

Quick Start

Run the design-review workflow on your target URL to start a visual audit and generate fixes.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I audit a live website for visual quality and spacing issues?▼

To audit a live website for visual quality, run a visual QA workflow on the target URL to surface typography, spacing, alignment, and color harmony issues across multiple pages. It generates detailed reports with atomic fixes for production and staging sites.

Can I verify UI improvements with before and after checks during a redesign?▼

Yes, before and after verification ensures traceable design polish by comparing the visual state before applying fixes and after committing them. This iterative workflow maintains quality control throughout redesigns and feature launches.

What is the best way to plan visual polish before implementing UI changes?▼

Plan-design-review mode conducts pre-implementation visual audits to guide UI improvements before coding. It identifies hierarchy and spacing problems early, allowing you to plan precise visual polish steps rather than retroactively fixing styles.

Does the visual QA process support atomic commits for individual design fixes?▼

Yes, the visual QA process enforces an iterative fix workflow that generates atomic commits for individual design adjustments. This allows developers to commit spacing and typography fixes individually, ensuring traceable and reversible code changes.

Can I run a typography and hierarchy audit on staging sites?▼

Yes, you can run typography and hierarchy audits on both staging and production sites. The visual review scopes across multiple pages and components to identify inconsistencies and plan polish before deploying feature launches.

Related Skills

Explore More Design & Creative Skills→
a29paula29paul
1

canary

Monitor production deployments for console errors, performance regressions, and visual anomalies.

Community
Advanced
OmerFarukOrucOmerFarukOruc
2

qa

Automate end-to-end QA testing and iterative bug fixes for web applications.

Community
Advanced
AshesOfTheUndeadAshesOfTheUndead

refined

Standardize Roblox UI design systems with semantic token definitions and component rules.

Community
Intermediate
abhishekmmgnabhishekmmgn

browse

Automate QA testing with a persistent Playwright headless browser.

Community
Advanced