claude-design-critic

# Claude Design Critic Some sites are technically fine and still scream "an AI made this in one shot." This skill names exactly why and tells you what to change. It reviews the design *and* the copy, because generated-looking text gives a build away as fast as a centered hero and a purple gradient. Use it as the finishing pass on `claude-landing-composer` output, on any vibe-coded frontend, or on a live site that feels generic. It pairs with the design tokens from `claude-design-system-architect` (audit against them when they exist). ## Step 1 — Take in the target A URL (WebFetch + screenshot), a local project (read the components/styles), or pasted code. Establish: what is this page for, who's the audience, and what's the one action it wants? A critique without the goal is just opinion. ## Step 2 — Audit across dimensions Go dimension by dimension and flag concrete instances, not vibes: **Layout & composition** - Every section a centered stack? Three-identical-cards reflex? Predictable hero → cards → CTA with no rhythm? Symmetry where asymmetry would feel crafted? Cramped or uniform whitespace? **Color** - Purple or default-AI gradients (the dead giveaway). Too many competing accents. Off-brand or arbitrary hexes not mapped to tokens. Contrast failures (check AA). **Type** - Default system sans at 2–3 sizes. No real modular scale. Weak hierarchy. Generic pairing. Line length / line-height that reads like a default. **Spacing & detail** - Uniform padding everywhere....