# impeccable

> A design skill for AI coding agents that steers them away from generic frontend looks

- Repository: https://github.com/pbakaus/impeccable
- Category: Agent skills & plugins
- Stars: 85,046 · Forks: 5,075 · Language: Rust · License: Apache-2.0
- Experience: Beginner friendly
- Page: https://ir.adyog.com/repos/pbakaus/impeccable/

AI models trained on similar SaaS templates tend to produce the same frontend look: Inter for every font, purple-to-blue gradients, cards nested in cards, gray text on colored backgrounds. Impeccable gives your coding agent explicit design guidance so it avoids these habits.

It installs as a single skill called /impeccable. You run /impeccable init once, and it inspects your project and writes a PRODUCT.md file with lasting facts about your audience, purpose and constraints. After that, you run commands like /impeccable audit or /impeccable polish on a page or component, and the agent follows the guidance.

It started from Anthropic's frontend-design skill for Claude and extends it with a shared command vocabulary and a detector. The CLI and browser extension run 61 deterministic rules without an LLM or API key. Other checks are done by the LLM as part of critique.

## What it does

- **One skill, 24 commands**: Commands include craft, shape, critique, audit, polish, distill, harden, animate, typeset and layout. All run through /impeccable, and you can pin one as its own shortcut, such as /audit.
- **Project setup with PRODUCT.md**: /impeccable init inspects the project, asks only about missing facts, and records audience, purpose, voice and constraints in PRODUCT.md. DESIGN.md can be generated from existing code with /impeccable document.
- **Deterministic detector rules**: 61 rules flag common AI design tells. The CLI and browser extension run them with no LLM and no API key.
- **Live browser iteration**: The live and generate commands let you iterate on a named element in the browser and compare variants.
- **Wide tool support**: The installer detects tools such as Claude Code, Cursor, Codex CLI, Gemini CLI, GitHub Copilot, Grok Build and Hermes Agent. It also offers submodule, plugin and manual copy installs.

## What you could build

- Audit an existing page for accessibility, performance and responsive problems.
- Run a critique on a landing page to review hierarchy and clarity before launch.
- Plan and build a new interface with the shape and craft flow instead of prompting from scratch.
- Harden a checkout form against edge cases, text overflow and error states.
- Check AI-generated frontend code for common design clichés using the detector rules.

## Who it's for

Developers who build frontends with an AI coding agent such as Claude Code or Cursor and want better-looking results; you should already know how to use slash commands or skills in your tool.

## Get started

From your project root, run the installer and pick your AI tool and whether to install per project or globally. Reload your tool, then run /impeccable init to create PRODUCT.md and try a command like /impeccable audit.

```
npx impeccable install
```
```
/impeccable init
```
```
npx impeccable update
```

Tags: design, agent-skills, frontend, claude-code, ui