Impeccable

What is Impeccable?

Impeccable is an open-source AI front-end design skill set (Apache 2.0 license) created by Paul Bakaus. It’s not a component library or CSS theme, but a “layer of AI design vocabulary.” Through 7 domain reference documents, 23 slash commands, and 25 deterministic anti-pattern rules, it teaches your AI to write truly design code, rather than generic “AI slop” aesthetics. It supports 11+ mainstream AI coding tools, including Cursor, Claude Code, Gemini CLI, and Codex CLI.

Impeccable’s main functions

• 23 design commands : Forming a shared design vocabulary with AI, covering /polish(texture enhancement), /audit(design audit), /critique(heuristic scoring), /typeset(typography optimization), /colorize(color scheme optimization), /layout(layout spacing), /distill(structural simplification), /animate(motion optimization), /bolder( /quieterenhancing/reducing visual impact), /shape(brand toolkit generation), /craft(design draft to code conversion), /live(real-time browser iteration), /document(generating DESIGN.md), /harden(production readiness check), etc.
• 7 in-depth reference documents : covering typography, OKLCH color and contrast, spatial design, motion graphics, interaction, responsive layout, and UX copywriting, automatically loaded every time AI writes code.
• 25 anti-pattern detection rules : deterministic rules (no LLM required), covering font, color, layout, animation, and quality dimensions, automatically identifying “AI slop” designs.
• Live Mode (Alpha) : Select any element directly in the browser, annotate with your suggestions, and AI will generate three production-level variants and replace them in real time via HMR. Once accepted, the changes will be automatically written back to the source code.
• Chrome extension : Detect anti-patterns (gradient text, AI color schemes, nested cards, low contrast, etc.) on any webpage with a single click; supports localhost, staging, and production environments.
• CLI tool : npx impeccable detect src/Scans projects, supports CI/PR checks, outputs JSON format, and can be integrated with build access control systems.
• PRODUCT.md / DESIGN.md generation : /impeccable teachOne-click creation of project design context files (audience, brand personality, backreferences); /impeccable documentgeneration of design specification documents according to Google Stitch standards.

How to use Impeccable

• Installation Skill Pack
  • Automatic installation: npx skills add pbakaus/impeccable(Automatically identifies and places files for tools such as Cursor, Claude Code, Gemini CLI, and Codex CLI).
  • Claude Code plugin: /plugin marketplace add pbakaus/impeccable.
  • Manual installation: Download the universal ZIP and extract it to the project root directory (at package.jsonthe same level).
• Initialize the project design context : Run /impeccable teach, generating PRODUCT.md(brand positioning, audience, anti-reference) and .impeccable.md(design context), which will be automatically read every time any command is used thereafter.
• Use commands
  • Direct access: /impeccable audit checkout(Audit closing page)
  • Automatic selection: /impeccable redo this hero(Let skill automatically select the best method)
  • Fixed shortcut command: /impeccable pin audit→ You can then use it directly./audit
• Browser Real-Time Iteration (Optional) : Runs /impeccable live, selects elements in the browser, annotates, generates variants, and automatically writes back to the source code after acceptance . Supports Vite, Next.js (including monorepo), SvelteKit, Astro, and Nuxt, and automatically handles CSP limitations.
• Install detection tools (optional)
  • Chrome extension: Highlight anti-mode with one click on any page.
  • CLI: npm i -g impeccable, run npx impeccable detect src/the scan project.
• Keep updated : npx impeccable skills updateRegularly pull the latest commands and antipattern definitions.

Key information and usage requirements for Impeccable

• Product Positioning : An AI front-end design skill set, not a component library or CSS theme, but an “AI design vocabulary layer” used to correct the homogenized aesthetics of AI-generated interfaces, often referred to as “AI slop”.
• Founder : Paul Bakaus (Founder of jQuery UI, former head of Google Chrome DevTools)
• Open source license : Apache 2.0, completely free
• Supported tools : Cursor, Claude Code, Gemini CLI, Codex CLI, VS Code Copilot, Kiro, Trae, Rovo Dev, OpenCode, Pi, Google Antigravity, etc. 11+
• Performance data : Tessl benchmark scores improved to 0.82/1.00, OKLCH color coverage increased to 12/12 scenes, representing an overall improvement of approximately 1.59 times.
• Installation requirements :
  • Recommendation: npx skills add pbakaus/impeccable(Automatically recognize AI tools and place files accordingly)
  • Claude Code:/plugin marketplace add pbakaus/impeccable
  • Manually: Download the universal ZIP file and extract it to the project root directory (at package.jsonthe same level) .

Impeccable’s core advantages

• Curbing “AI Design Homogenization” : Through an Anti-attractor mechanism, AI is forced to list and reject its reflective default options (such as Inter fonts and purple-blue gradients) before generation, resulting in a significant increase in the diversity of output fonts and colors.
• Dual registration for brands and products : Automatically distinguishes between “brand design” (marketing website, landing page, design as a product) and “product design” (app UI, dashboard, design service products), and automatically adapts commands to the corresponding keywords.
• Data validation results : Third-party benchmark tests of Tessl show that after use, the overall score improved from the baseline to 0.82/1.00 , and OKLCH color usage coverage increased from 0 to 12/12 scenes, an overall improvement of approximately 1.59 times.
• Zero intrusion, fully open source : Licensed under the Apache 2.0 license, it does not rely on external tools or IDE extensions, and injects AI context through standard skill mechanisms.
• Full-chain coverage : From brand strategy interviews ( /shape) → high-fidelity prototypes → real code ( /craft) → real-time browser iteration ( /live) → design audit ( /audit) → specification documents ( /document)