Claude MarketplacesSubmit
jezweb avatar

Design Review

jezweb/claude-skills

This runs visual design QA on your web app, checking layout, typography, spacing, color, hierarchy, and component consistency. It's not a UX audit (that's about usability), it's about whether your interface looks polished or looks like a developer designed it. The breakdown tables are genuinely useful: consistent spacing versus random gaps, semantic color tokens versus raw Tailwind classes, one clear CTA versus three equally styled buttons. It catches things like invisible text in dark mode, buttons with different heights sitting inline, and truncation without ellipsis. Works with whatever browser tool you have set up. Good for a quality check before shipping or when something "looks off" but you can't pinpoint why.

skills.sh installs
1.5K
GitHub stars
1.1K
last updated
Aug 21, 2026
View on GitHub

Install

$ npx -y skills add jezweb/claude-skills --skill design-review --agent claude-code

Installs into .claude/skills of the current project.

Files

Design Review

Review a web app or page for visual design quality. This is not a UX audit (usability, workflow, friction) — this checks whether the design is professional, consistent, and polished.

The goal: would a design-conscious person look at this and think "this is well made" or "this looks like a developer designed it"?

When to Use

  • Before showing something to a client or team
  • When something "looks off" but you can't pinpoint why
  • After building a feature, before calling it done
  • Periodic quality check on a shipped product
  • After a UX audit — this is the visual companion

Browser Tool Detection

Same as ux-audit — Chrome MCP, Playwright MCP, or playwright-cli.

URL Resolution

Same as ux-audit — prefer deployed/live over localhost.

What to Check

1. Layout and Spacing

SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Details

Repository
github.com/jezweb/claude-skills
Categories
Frontend Development, Git & Pull Requests, Code Review & Quality, Design & UI/UX
First seen
May 16, 2026

More from jezweb/claude-skills

All 166

Recommended

More Frontend Development
1antdv-next avatarantdv-nextantdv-next/skillsAntdv Next Vue 3 component library. Use when locating component API docs, props/events/slots, playground demos, or theme token definitions.1.5Kskills.sh installs
2quodsoler avatarue-editor-toolsquodsoler/unreal-engine-skillsUse when extending the Unreal Editor with editor tool, editor utility widget, Blutility, detail customization, property customization, editor mode, asset editor1.5Kskills.sh installs
3onewave-ai avatarscreenshot-to-codeonewave-ai/claude-skillsConvert UI screenshots into working HTML/CSS/React/Vue code. Detects design patterns, components, and generates responsive layouts. Use this when users provide 1.5Kskills.sh installs
4alirezarezvani avatarsenior-fullstackalirezarezvani/claude-skillsFullstack development toolkit with project scaffolding for Next.js, FastAPI, MERN, and Django stacks, code quality analysis with security and complexity scoring1.4Kskills.sh installs
5dylantarre avatarweb-motion-designdylantarre/animation-principlesUse when building CSS animations, JavaScript transitions, React/Vue motion, or any browser-based animation work.1.4Kskills.sh installs
6mindrally avataralpine-jsmindrally/skillsAlpine.js development guidelines for lightweight reactive interactions with Tailwind CSS and various backend frameworks.1.4Kskills.sh installs