Free guide · Impeccable + Claude

Claude builds every site with the same five tells. One skill overrides all of them.

Inter for everything, a purple gradient, cards inside cards, gray text on color, rounded corners. You have seen it a hundred times, you have probably shipped it. Impeccable gives you and Claude a shared design language so you can direct the design instead of hoping the next try looks less generic.

See the course

No signup needed. Everything is right here on this page.

the-five-tellsOverridden

AaInter everywhere

Purple gradient

Cards in cards

AaGray on color

Over-rounded

What it actually is

A design skill you install once, free and open source.

Impeccable is a free, Apache-licensed repo by Paul Bakaus with tens of thousands of stars. It is a skill for your AI coding tool: seven reference files, more than twenty commands, and explicit anti-pattern rules that override the defaults every model reaches for. It works with Claude Code, Cursor, Gemini CLI, Codex, and the rest, and it is better than Anthropic's own frontend design skill.

Why this works

Claude is not the problem, its training data is.

Every model was trained on the same SaaS templates, so build me a landing page reaches for the only visual vocabulary it knows: the average of its training data. You do not fix that by becoming a designer. You fix it by handing the model an explicit set of anti-patterns and a shared language to override the defaults. That is the whole trick.

Install · about 60 seconds

One command, then reload

# from your project root
npx impeccable skills install

Run this from the root of your project. It auto-detects your tool and writes the skill to the right place, then reload your tool and you are done.

/plugin marketplace add pbakaus/impeccable

Prefer the Claude Code plugin? Use the marketplace command instead.

To check it is live, type a slash in Claude Code. If you see /impeccable in the list, you are installed.

The three before you ship

Run these in order

After Claude builds something, run them as bolder, then distill, then polish.

/impeccable bolder

When it feels flat, safe, forgettable

Amplifies contrast and hierarchy. Pushes type scale, weight, and spacing so the important things actually look important.

/impeccable distill

When it feels noisy or cluttered

Strips to the essence. Removes decorative noise, redundant borders, and nested-card sprawl until only what matters is left.

/impeccable polish

Right before you ship

Final pass: design-system alignment, spacing consistency, state coverage, and shipping readiness. The last thing you run.

Bonus

Spot the slop before anyone else does

Impeccable also ships a Chrome extension that scans your live site and points out exactly where the AI tells are hiding, so you know what to fix.

One safety note

A skill is instructions your agent runs

git submodule add https://github.com/pbakaus/impeccable .impeccable
npx impeccable skills link --source=.impeccable --providers=claude

Read what you install. Open the skill files first. Design guidance should never touch your shell, your env vars, or the network.
Pin a version. Install from a specific commit or tag, not always the latest, so an upstream change cannot silently alter your agent.
Scope it. Install per project first, not globally, until you trust it.
Watch for the tells. If a design skill asks to read your .env, hit an external URL, or run extra scripts, stop.

From free guide to finished product

You have the free part. Here is the whole path.

Everything above is yours, free. When you are ready to go from a blank screen to a real product you own, live on your own domain, this is the step that gets you there. Prices are right here, so you never have to go looking.