← ClaudeAtlas

do-design-auditlisted

Audit an existing web UI against premium design criteria. Screenshots pages and evaluates visual hierarchy, typography, color, spacing, consistency, and more. Use when the user wants to evaluate design quality, audit a UI, or says 'review this design', 'check the UI', 'audit this page', 'scan the interface', or provides a URL for design feedback.
tomcounsell/ai · ★ 14 · AI & Automation · score 73
Install: claude install-skill tomcounsell/ai
This skill evaluates existing web interfaces against premium design criteria. It is the review-time companion to `/frontend-design` — that skill builds to the standard; this one audits against it. Be opinionated. Call out what fails clearly. "Acceptable" is not a compliment. ## Surface This skill runs against the user's real, logged-in Chrome via the BYOB MCP server (`mcp__byob__browser_*`). Public marketing pages and authenticated dashboards are audited the same way — BYOB just shows you the page the user would see. There is no anonymous-headless fallback; that surface was retired in #1256. The calling session **must** have `requires_real_chrome=True` set (bridge auto-infers from message text for "design audit" patterns; CLI users pass `valor-session create --needs-real-chrome ...`). Two concurrent real-Chrome sessions race on the active tab and corrupt each other's DOM. ## When to Use Trigger this skill when the user: - Provides a URL and asks for design feedback - Says "review this design", "check the UI", "what do you think of this interface" - Asks whether something looks professional, polished, or premium - Wants to know what to improve before launching ## Variables - `url` (required): The URL to review. Can be a local dev server (`http://localhost:3000`) or a deployed URL. - `--pages` (optional): Comma-separated paths to screenshot explicitly (e.g. `/,/about,/pricing`). If omitted, the skill discovers pages by following navigation links from the start URL. ##