Impeccable: The Design Skill That Made Claude Code My Most Valuable UI/UX Asset

Impeccable: The Design Skill That Made Claude Code My Most Valuable UI/UX Asset AI May 14, 2026 7 min /ai/impeccable-design-skill-claude-code/ Impeccable, by Paul Bakaus, is a Claude Code skill that gives the model the actual vocabulary designers use, then enforces it across 23 commands. After running it on dashboards, marketing sites, internal tools, and client work, it has become a permanent fixture in my stack.

I have been shipping applications with heavy AI assistance for a while now, and I have tried dozens of Claude Code skills along the way. Impeccable, by Paul Bakaus (the jQuery UI legend), is the one I cannot live without. It is not just another "avoid AI slop" prompt pack. It is a full design vocabulary and workflow engine that gives Claude, and tools like Cursor or Gemini CLI, the exact language designers use every day.

I have used it on dashboards, marketing sites, internal tools, and client projects. The results are interfaces that feel intentional, on-brand, production-ready, and, most importantly, mine. It is now a permanent fixture in my quiver. Here is how I actually use it, every single command broken down with real examples from my work and from public case studies.

1. Run npx skills add pbakaus/impeccable, or grab the universal ZIP from impeccable.style and drop the .claude/ folder into your project.
2. In Claude Code, type /impeccable. You will see all 23 commands.
3. First command on any new project: /impeccable teach. It runs a short interview, creates PRODUCT.md (audience, brand personality, "brand vs product" register, anti-references) and a fully spec-compliant DESIGN.md in Google Stitch format.

That is it. Every subsequent command now reads those two files automatically. No more repeating context.

Pro tip: pin your favorites with /impeccable pin polish or /impeccable pin audit so you can just type /polish or /audit.

Impeccable consolidates everything under /impeccable (v3.0+). Here is the full set, grouped by how I actually use them in my workflow.

Setup and planning

• /impeccable teach. One-time project onboarding. Creates PRODUCT.md + DESIGN.md. On a fintech dashboard, it asked about target users (busy CFOs) and anti-references (no "SaaS purple"). Saved me hours of prompt repetition.
• /impeccable shape. Structured UX/UI discovery brief before any code. I used it to plan a complex multi-step onboarding flow. The output was a crystal-clear brief that guided the entire build.
• /impeccable craft. End-to-end: discovery, design brief, full coded UI, visual iteration. Real case: the Neo Mirai conference site. Started with reference images, /craft turned them into a responsive, polished website in one flow.
• /impeccable document. Reverse-engineers existing code into a fresh DESIGN.md.
• /impeccable extract. Pulls reusable tokens and components into your design system.

Evaluation

• /impeccable critique. UX review: hierarchy, clarity, emotional resonance, persona testing, scoring. On a task manager, it scored the dashboard 6.8 out of 10 and flagged weak visual hierarchy in metrics. The suggested fixes instantly improved scannability.
• /impeccable audit. Technical quality: a11y (WCAG), perf, responsive, focus styles, reduced-motion. P0 to P3 severity. On a blog I built, it caught 18 issues (missing alt text, no skip link, repaint-heavy gradients). Fixed in minutes.

Targeted refinement (my daily drivers)

• /impeccable polish. Meticulous final pass: alignment, spacing, micro-details, design-system alignment.
• /impeccable typeset. Typography hierarchy, scales, rhythm, font choices.
• /impeccable layout. Spacing, rhythm, composition.
• /impeccable colorize. Strategic color on monochrome UIs, never garish.
• /impeccable animate. Purposeful motion and micro-interactions.
• /impeccable delight. Small personality touches that make it memorable.
• /impeccable bolder. Amplify safe designs.
• /impeccable quieter. Tone down overly aggressive ones.
• /impeccable distill. Ruthless simplification.
• /impeccable clarify. Fix confusing UX copy, labels, error messages.
• /impeccable adapt. Responsive and contextual adaptations.
• /impeccable optimize. LCP, bundle size, repaint fixes.
• /impeccable harden. Edge cases, i18n, error states, overflow.
• /impeccable overdrive (beta). Shaders, physics, cinematic effects.

Special

• /impeccable live (alpha). Browser-based iteration: pick any element on your dev server, drop a comment or stroke, get three production-quality variants via HMR. Accept one and it writes back to source. Game-changer for visual tweaking without leaving the browser.
• /impeccable (the home command). Freeform design with the full handbook loaded when nothing else fits perfectly.

1. /impeccable teach (once per project).
2. /impeccable shape, or jump straight to /impeccable craft.
3. /impeccable critique + /impeccable audit.
4. Targeted fixes: /typeset, /layout, /colorize, /animate, etc.
5. /impeccable polish + /impeccable harden + /impeccable optimize.
6. /impeccable live for final visual polish.

I often combine it with Anthropic's official frontend-design skill for even bolder aesthetics.

Google released DESIGN.md (Stitch format) in early 2026 as a single Markdown file with YAML tokens plus human rationale. It has become the de-facto portable design-system artifact, perfect for version control and cross-tool consistency.

Similarities:

• Both fight AI drift and enforce consistency.
• Both are plain-text, Git-friendly, and live in your project root.

Differences:

• DESIGN.md is static data: colors, typography, components, do's and don'ts.
• Impeccable is active intelligence: commands, anti-pattern detectors (27 deterministic rules), domain references (typography.md, color-and-contrast.md, motion.md, etc.), and a shared vocabulary.

They complement each other perfectly. In fact, Impeccable is built for it.

• /impeccable teach and /impeccable document generate a full Stitch-compliant DESIGN.md automatically.
• Every single Impeccable command reads both PRODUCT.md and DESIGN.md before acting. No more drift.
• Result: Claude stays on-brand across sessions, across tools (Claude Code, Cursor, Stitch), and across team members.

In my projects I now treat DESIGN.md as the single source of truth for tokens, while Impeccable provides the why and the how through its commands. It is the missing execution layer Google's format needed. I have handed off DESIGN.md files to other AI tools and watched them respect the system because Impeccable first made it robust.

Impeccable did not just improve my outputs. It changed how I design with AI. I spend less time fighting generic slop and more time on strategy, user needs, and that final 20% of delight that makes an interface feel human.

If you are building anything with a frontend, do yourself a favor: install it today, run /impeccable teach, and try /impeccable craft on your next feature. You will immediately feel the difference.

Have you tried Impeccable yet? Drop your favorite command or workflow in the comments. I am always looking for new ways to level up the stack.