The Foundation
Before commands, before detection, Impeccable teaches your AI real design. Deep reference knowledge across 7 dimensions, loaded every time your AI writes code.
Run /impeccable teach once to set your project's design context. Every command benefits.
The Language
21 commands form a shared vocabulary between you and your AI. Each one encodes a specific design discipline, so you can steer with precision.
Pick any command to see it in action. View cheatsheet →
The Antidote
Every AI model learned from the same templates. Without intervention, they all produce the same predictable mistakes. Impeccable names them, detects them, and teaches the AI to avoid them.
Visual Mode
See design issues highlighted directly on the page. No screenshots, no guesswork. Impeccable’s overlay shows you exactly what’s wrong and where.
No LLM needed. Pattern matching catches purple gradients, overused fonts, nested cards, low contrast, and more.
The Chrome extension on any site, embedded in /critique during an AI design review, or standalone via npx impeccable live.
Get Started
1Install the skills Recommended
21 commands that steer your AI toward better design, in real time. The full Impeccable experience.
npx skills add pbakaus/impeccable
/impeccable teach to set up your project's design context.
/plugin marketplace add pbakaus/impeccable
/plugin in Claude Code
2Add the CLI Beta
Anti-pattern detection from the terminal. Scans HTML, CSS, JSX/TSX, Vue, and Svelte. Perfect for CI, pre-commit hooks, and one-off audits.
npm i -g impeccable
npx impeccable directly without installing.
3Browser extension Coming soon
One-click anti-pattern detection on any live page: yours, staging, production, or anyone else's. Same detection engine as /critique, in your browser.
Currently in Chrome Web Store review.
4Stay updated
Roughly monthly notes on new commands, anti-patterns, and the design thinking behind Impeccable.
What's New
- Data-driven skill rewrite. The core skill (renamed from
frontend-designtoimpeccable) was rebuilt using a multi-model eval framework that runs the skill with and without the improvements across 7 design niches and measures how much the output collapses into monoculture. Not vibes, numbers: on Qwen 3.6 Plus, overused Fraunces headings dropped from 92% to 0% on kids reading, side-tab borders from 76% to 20% on vintage moto, no theme regressions elsewhere. Run/impeccable teachonce to set your project's design context. - Anti-pattern detection engine. 25 rules across typography, color & contrast, layout, motion, and design quality. Handles modern color formats (oklch/oklab/lch/lab), CSS variables inside border shorthands, gradient-backed text, and emoji-only nodes — the hard-to-hit cases that slip past regex-only scanners.
- CLI:
npx impeccable detect. Scans HTML, CSS, JSX/TSX, Vue, Svelte, and CSS-in-JS with framework detection, multi-file import tracking, live URL scanning (via Puppeteer), JSON output for CI, and a--fastregex mode for huge codebases. - Chrome DevTools extension. One-click detection on any page — yours, staging, production, or someone else's. Reads live computed styles, surfaces findings in an interactive panel, and highlights offending elements on the page. In Chrome Web Store review.
/critiquegot teeth. Persona sub-agents now review in parallel, score against Nielsen's heuristics, run the detector automatically, and open a live browser overlay so you can walk each finding on the rendered page.- New command:
/shape. Interviews you about purpose, audience, and goals before writing a single line of design — so the AI actually understands the brief instead of jumping straight to CSS. - Rebuilt site and docs. New narrative (Foundation → Language → Antidote → Visual Mode), a browsable skills index with per-skill detail pages and before/after demos, tutorials walk-throughs, an anti-patterns index, and the Gallery of Shame with live detection overlays. Mobile experience overhauled end-to-end.
- New harness: Rovo Dev. Brings the total to 11 supported AI tools.
- Licensing unified to Apache 2.0. CLI merged back into this repo; every component now ships under a single permissive license.
View older releases
- New provider: Trae (China + International)
/critiquenow scores against Nielsen's 10 heuristics, tests with persona archetypes, and assesses cognitive load/auditnow scores 5 dimensions with P0-P3 severity ratings and structured action plans- Improved skill descriptions for better agent auto-discovery
- Fixed invalid YAML frontmatter that broke GitHub preview and Codex loading (#67)
- Codex CLI now uses correct
$prefix for command references
/typesetnow recommends fixed type scales for app UIs, reserving fluid typography for marketing/content pages
- 3 new skills:
/typeset(fix typography),/arrange(fix layout & spacing),/overdrive(technically extraordinary effects, beta) - Skills now auto-gather design context via
.impeccable.md. Run/teach-impeccableonce, all skills benefit - Deep linking to commands (
#cmd-overdrive, etc.)
- Added OpenCode provider support
- Added Pi provider support
- Recategorized
/onboardas an enhancement command
- Added Kiro support (
.kiro/skills/) - Restored prefix toggle: download
i-prefixed bundles to avoid naming conflicts - Audit and critique skills only suggest real, installed commands
- Unified skills architecture: commands are now skills with
user-invocable: true - Added VS Code Copilot and Google Antigravity support (
.agents/skills/) - New install flow:
npx skills addas primary, universal ZIP as fallback - Added universal ZIP containing all 5 provider directories
- Renamed
/simplifyto/distillto avoid Claude Code conflict
- Initial release with enhanced frontend-design skill
- 17 design commands: /polish, /audit, /distill, /bolder, and more
- Support for Cursor, Claude Code, Gemini CLI, and Codex CLI
- Interactive command cheatsheet
Frequently Asked Questions
Where do I put the downloaded files?
The easiest way is npx skills add pbakaus/impeccable, which auto-detects your AI harness and places files correctly.
If you downloaded the universal ZIP, extract it to your project root (same level as your package.json or src/ folder). It creates hidden folders for each supported tool: .cursor/, .claude/, .gemini/, .codex/, and .agents/.
Project-level installation takes precedence and lets you version control your skills.
How do I update to the latest version?
- All tools:
npx skills update(ornpx skills checkto see what's new first) - Claude Code plugin: Open
/plugin, go to the Discover tab, and update from there - Manual ZIP: Download the latest ZIP from above and extract to your project root, overwriting existing files
Your .impeccable.md design context file (created by /impeccable teach) is never overwritten. Your project context is preserved across updates.
Commands or skills aren't appearing. What do I do?
For commands: Type / in your AI harness and look for commands like /audit, /polish, etc. If they don't appear, double-check the files are in the correct location.
For skills: Skills are applied automatically when relevant. To verify, explicitly mention "use the impeccable skill" in your prompt. This forces the AI to acknowledge and apply it.
Tool-specific setup:
- Cursor: Requires Nightly channel + Agent Skills enabled in Settings → Rules
- Gemini CLI: Requires
@google/gemini-cli@preview+ Skills enabled via/settings
I'm new to AI harnesses. Where do I start?
Skills and commands are intermediate features. If you're just getting started, learn the basics first:
- Claude Code: Official Documentation
- Cursor: Cursor Docs
- Gemini CLI: Gemini CLI Docs
- Codex CLI: Codex GitHub
Once you're comfortable with basic prompting and code generation, come back and give Impeccable a try.
Is Impeccable free?
Yes. Everything is Apache 2.0: skills, commands, CLI, and the detection engine. Fully open source, free for everyone.
Work with me
Impeccable is built by Renaissance Geek. I work with enterprise teams on large-scale rollouts, custom integrations, and training for designers and developers. If you're a frontier lab, design tool company, or enterprise looking to raise the bar on AI-generated design, let's talk.