Dev.to AI 🤖 Ai 👁 0 📖 6 min read

Impeccable skill for Claude Code: 24 design commands, tested

Impeccable by Paul Bakaus is the most complete design skill for coding agents, and the most ambitious. Where most design skills are one SKILL.md of advice, Impeccable is a design language: 24 commands to shape, build, cr

Impeccable skill for Claude Code: 24 design commands, tested

Impeccable by Paul Bakaus is the most complete design skill for coding agents, and the most ambitious. Where most design skills are one SKILL.md of advice, Impeccable is a design language: 24 commands to shape, build, critique, audit and polish an interface, about 40 reference playbooks, a deterministic detector for generated-design anti-patterns, and a small engine binary the agent calls for context. Its repository had about 79,000 stars on 9 October 2026.

We ran it on a real brief beside a run with no skill and runs with three other design skills. It produced the boldest page of the five, and it was the only run that did not invent facts about the product. It was also by far the slowest and most expensive. Here is what it is, how to install it, and what happened.

What Impeccable gives your agent

A command for each design job. The SKILL.md lists them by category:

Category Commands
Build shape (plan the UX before code), init (record product context in PRODUCT.md), document (write DESIGN.md from existing code), extract (pull tokens and components into a system)
Evaluate critique (UX review with heuristic scores), audit (accessibility, performance, responsive checks)
Refine polish, bolder, quieter, distill, harden (errors, i18n, edge cases), onboard
Enhance animate, colorize, typeset, layout, delight, overdrive
Fix clarify (UX copy), adapt (devices and screen sizes), optimize (UI performance)
Iterate live (pick elements in the browser and try alternatives), generate (variants of a named element)

Run one as /impeccable audit, /impeccable bolder hero and so on, or just describe the design work and let it route.

Four modes. It decides what success means for the surface first: Persuade (landing and pricing pages: the visitor acts), Operate (app UI and dashboards: the visitor completes a task), Read (docs and articles) or Experience (portfolios and showcases).

Rules about truth. "The brief wins" over Impeccable's own taste, and "Ask before replacing factual copy or adding claims." When it cannot ask, it writes down what it inferred and what it does not know. That rule turned out to matter more than anything else in our test.

A detector and an engine. impeccable context loads PRODUCT.md, DESIGN.md and the guidance for the surface; impeccable detect scans a file for anti-patterns such as cramped padding, low contrast, the "thin border and wide shadow" card and overused fonts. The launcher downloads a self-contained binary on first run and checks it against a published SHA-256 checksum before running it.

Install it

The author's installer detects your agents and asks whether to install for the project or globally:

npx impeccable install

Then run /impeccable init in your agent to record the product context. It works with Claude Code, Cursor, Codex, Gemini CLI and others, and on Claude Code it also installs an optional hook that runs the detector after UI edits. From SkillGild:

skillgild install impeccable --agent claude-code

The test

The brief: a landing page for Ledgerline, a fictional bookkeeping app for freelance designers, as one self-contained HTML file with Google Fonts as the only external resource. It listed the sections and forbade invented testimonials, customer counts, logos and awards. Five runs got the same brief: no skill, Anthropic's frontend-design, Taste Skill, UI UX Pro Max and Impeccable. All used Claude Code 2.1.278 with Claude Opus 5 on 9 October 2026, with the Skill tool switched off so nothing else installed could load. One run each: an example, not a benchmark.

How Impeccable worked

It ran impeccable context, found no PRODUCT.md, and noticed it had no way to ask questions in a headless run. So, as its rules require, it inferred the product from the brief and wrote a PRODUCT.md that marks what is inferred and lists what is unknown:

Undecided / unstated (must not be invented by future work): which banks or import methods are supported, which countries' or states' taxes are covered, whether invoicing or expense receipts exist, team or accountant access, data export, annual billing, card-required-or-not at trial signup, mobile apps, integrations.

It then picked a direction with a seeded "concept roll": it listed candidate worlds grounded in the subject and the engine assigned one, here a Swiss departure board. The run's reasoning: money arriving and leaving is a timetable, the quarterly tax date is the next departure, and a board is something you read rather than keep. That became the page's line, "Your money, on the board. Not in a spreadsheet."

The Impeccable run's hero at 1440 px: a signal-yellow poster headline
With Impeccable. The board's footer says the clients, amounts and dates are made up for the page.

The baseline run's hero at 1440 px: cream page, serif headline with a highlighted phrase
The same brief with no skill.

After building, it read its craft-floor rules, checked contrast and overflow, ran the detector, fixed four real findings, and ran a review pass that caught the hero headline overflowing its column at 1440 px. Finally it wrote a DESIGN.md of about 17 KB describing the system it had shipped, so later work can follow it.

What came out

The client tags flip into place like split-flap letters on load, and a quarter selector (Q2, Q3, Q4) re-flips the whole board. The type is Barlow Condensed for the board and headlines with Barlow for reading text. It is the only one of the five pages you would remember tomorrow.

The Impeccable page scrolled from top to bottom at 1440 px
The whole Impeccable page, top to bottom (no sound). Watch it on skillgild.dev.

Most important, it invented nothing. Every other run, including the one with no skill, added product facts the brief never gave: read-only bank connections, lists of supported countries, CSV and PDF exports, "no card needed", 30-day data retention. Impeccable's page talks only about importing, tagging, tax estimates, the 14-day trial and the $12 plan, which is all the brief said.

We ran Impeccable's detector over all five finished pages:

Detector findings No skill frontend-design Taste Skill UI UX Pro Max Impeccable
All findings 21 5 6 27 55
Without cramped-padding and design-system rules 17 0 3 21 8

Read the first row with care. Impeccable's run found that most cramped-padding hits are false positives on pages that compute padding with calc(), which its page does throughout. The design-system rules check a page against its own DESIGN.md, so they only fire on Impeccable's page, the only one with a DESIGN.md. With those set aside, its remaining findings are mostly all-caps body text, which is the departure-board style rather than an oversight.

What it costs

The run took 46 turns and 23.8 minutes, and Claude Code reported an API-equivalent cost of $7.49. The baseline took 2 turns, 3.3 minutes and $0.98; the other skills cost between $1.61 and $2.42. Impeccable's own SKILL.md tells the agent to verify in bounded passes rather than loop, and this run did stop, but a full build through every stage is expensive. For small changes, call one command (/impeccable polish, /impeccable audit) instead of asking for a whole new surface.

The departure-board concept also carries risk for a money product: long transaction names in condensed capitals are slower to read, and the split-flap client tags, one letter per tile, take a moment to parse. Because the concept roll is seeded, another run would likely choose a different world; if you want a particular direction, say so, since the brief overrides the roll.

The Impeccable page at 375 px: logo, the four nav links in one row, a full-width trial button, then the headline and email form
Impeccable at 375 px: no horizontal scroll.

Getting the most from it

/impeccable init
<answer its questions about the product, or point it at your docs>

Use Impeccable to build the landing page. Direction: <a world, or "roll one">.
Keep: <brand constraints>. Then run /impeccable audit and fix what it finds.

Running init interactively gives it real product facts instead of inferences, and the PRODUCT.md it writes keeps every later command honest. For an existing interface, critique and audit are the cheapest way to use it.

Compare it with the other nine in the top Claude frontend and design skills.

Originally published at skillgild.dev.

📰 Read the original article on Dev.to AI

Originally published by Dev.to AI. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.