Skip to content
ML2
Vibe-Coding & Prompt-to-AppTool#Plugin / extension#Open source#CLI

Impeccable: give your coding agent a design vocabulary and an A.I.-slop detector

Added NewCopyable prompt below

Published Last verified Released

Our verdict

Install it if your agent builds front-ends and you want a check, not just better prompts. /impeccable init writes a PRODUCT.md with your audience, purpose and voice so later commands (critique, audit, polish, typeset, harden and others) work from real context. The part that sets it apart is the deterministic detector: npx impeccable detect scans a folder, an HTML file or a live URL against 62 rules (purple gradients, nested cards, overused fonts, low contrast, small touch targets, skipped headings) with no model and no API key, and can emit GitHub Actions annotations. Builders have posted before-and-after scans: one page went from 36 findings to zero, another from 7 findings in 1.4 seconds to a clean re-scan. A clean scan is not proof of good design (the README says so), and Codex and Grok Build need you to approve its hooks. If you mainly want an agent to build or redesign pages, Hallmark covers that; Impeccable is stronger as the checker and shared vocabulary.

Who it's for
Builders who use Claude Code, Cursor, Codex, Copilot, Gemini CLI or Hermes Agent for front-end work and want repeatable design checks, including in CI
Leverage
A design review and an anti-pattern lint that run on every edit or every pull request, instead of eyeballing each generated page
Effort
Low
Date added

What it does

Impeccable (pbakaus/impeccable, Apache-2.0, by Paul Bakaus) is one skill with 24 commands, a live browser mode for trying variants of an element, a Chrome extension and a standalone CLI engine. npx impeccable install detects your agent folders, installs the skill into the project or globally and, on Claude Code, Cursor, Codex, GitHub Copilot and Grok Build, adds a hook that runs the detector on UI file edits and feeds findings back to the agent. The CLI runs the same 62 deterministic rules without an agent: exit code 2 means findings, --json gives machine-readable output, --github prints Actions annotations, and ignores can be set per rule, file or value (for example keeping Inter as a brand font). It started from Anthropic's frontend-design skill and was first published on 16 November 2025.

How builders use it

  • Run npx impeccable install in the project root, reload your agent, then /impeccable init to write PRODUCT.md.
  • Before shipping, run /impeccable critique and /impeccable audit on the page, then /impeccable polish.
  • Scan any page without an agent: npx impeccable detect index.html, or a live URL with Chrome installed.
  • Add npx impeccable detect --github src/ to a CI step so pull requests show design findings as annotations.
  • Whitelist deliberate choices with npx impeccable ignores add-value overused-font Inter --reason "Brand font".

What to expect

Pages that drop the common A.I. tells, a design context file your agent reuses, and a design lint that runs in CI.

Copy this: Install, init, detect

# Official sources: github.com/pbakaus/impeccable (Apache-2.0), impeccable.style
npx impeccable install        # pick agents and scope; reload your agent

# In your coding agent:
/impeccable init              # writes PRODUCT.md
/impeccable critique landing
/impeccable audit blog
/impeccable polish settings

# No-LLM detector (no API key):
npx impeccable detect src/
npx impeccable detect https://example.com     # needs Chrome/Chromium/Edge
npx impeccable detect --github src/           # GitHub Actions annotations
npx impeccable detect --list-rules

# Codex: approve the project hook in /hooks after install or update.

Related discoveries

See the newest picks →

Want more like this?

Practical discoveries, without the noise.

Get the newsletterMore in Vibe-Coding & Prompt-to-App