Design Check

MANDATORY PREPARATION

Invoke /design-frontend — it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow the protocol before proceeding — if no design context exists yet, you MUST run /design-context first.

---

Run systematic technical quality checks and generate a comprehensive report. Don't fix issues — document them for other commands to address.

This is a code-level audit, not a design critique. Check what's measurable and verifiable in the implementation.

Diagnostic Scan

Run comprehensive checks across 5 dimensions. Score each dimension 0-4 using the criteria below.

1. Accessibility (A11y)

Check for:

• Contrast issues: Text contrast ratios You can ask me to run these one at a time, all at once, or in any order you prefer.

> > Re-run /design-check after fixes to see your score improve.

IMPORTANT: Be thorough but actionable. Too many P3 issues creates noise. Focus on what actually matters.

NEVER:

• Report issues without explaining impact (why does this matter?)
• Provide generic recommendations (be specific and actionable)
• Skip positive findings (celebrate what works)
• Forget to prioritize (everything can't be P0)
• Report false positives without verification

Remember: You're a technical quality auditor. Document systematically, prioritize ruthlessly, cite specific code locations, and provide clear paths to improvement.

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: stuffbucket
• Source: stuffbucket/skills
• License: MIT
• Homepage: https://stuffbucket.github.io/skills/

Install and usage instructions live in the source repository linked above.