Impeccable
68k

Automatic design checks

Catch design problems while your agent works.

On this page 5 sections

Design hooks run the detector during your agent’s work on UI files. Findings give the agent a chance to correct a problem while the change is still in context.

Turn checks on

In your AI coding tool, check the current setup:

/impeccable hooks status

Enable or disable checks for this project:

/impeccable hooks on
/impeccable hooks off

Allow hooks in your coding tool

Claude Code

In an interactive session, accept workspace trust. Open /hooks to inspect Impeccable’s PostToolUse and Stop hooks. Project installs normally use .claude/settings.local.json; plugin installs can supply their own hooks.

Claude Code’s hook and trust guidance

Codex

Open Settings → Hooks in the app, or /hooks in the CLI. Review and trust Impeccable’s PostToolUse and Stop hook definitions. New or changed definitions need review again.

Codex’s hook and trust guidance

Cursor

Trust the workspace, then check Customize → Hooks for the project’s .cursor/hooks.json. Cursor reloads this file when it changes. If it still does not appear, restart Cursor and check the Hooks output channel.

Cursor’s hook guidance

GitHub Copilot

Commit .github/hooks/impeccable.json and merge it into the repository’s default branch. This is a shared project hook used by Copilot CLI and the cloud agent. In the CLI, also accept the folder’s trust prompt.

Copilot’s hook setup guidance

Grok Build

Run /hooks-trust to review and trust the project hooks in .grok/hooks/. Use /hooks to inspect the loaded hooks.

Grok Build’s hook guidance

What happens while you work

  1. 01The agent changes UI code

    The hook checks supported edits to components and styles.

  2. 02The detector finds an issue

    It identifies the problem and provides a correction direction.

  3. 03The agent can respond

    It can fix the issue, or explain an intentional choice.

The delivery point depends on your coding tool. Cursor checks proposed writes before they land.
  • Claude Code and Codex: focused feedback after edits, followed by a broader check when the agent finishes its turn.
  • Grok Build: edits are tracked as they happen; findings reach the agent when it finishes its turn.
  • GitHub Copilot: the full detector runs after supported edits.
  • Cursor: the full detector checks supported proposed writes. A finding can block the write so the agent can revise it first.
Why some checks wait until the end of a turn

For Claude Code and Codex, the per-edit pass focuses on immediate problems: broken images, overflow, poor legibility, gradient text, glow, and design-system drift. Broader checks run on the session’s touched UI files at the Stop event, when the agent finishes responding. Previously reported findings are filtered out.

This gives unfinished work room to develop without repeating every observation after every edit. A later stop stays quiet if there is nothing new to report.

Set hook.perEditRules to "all" for the full rule set after each edit. Cursor and Copilot already use the full set because Impeccable does not defer their findings to a Stop pass. Grok delivers feedback through Stop even when it scans during edits.

Hooks check web code. They skip projects whose PRODUCT.md declares ios, android, or adaptive. Use audit for native interface reviews.

Confirm checks are working

After installing or moving a project, run doctor:

/impeccable doctor

It can find a hook whose script path no longer exists, or a mismatch between its installed configuration and enabled state. No messages can mean a clean edit, quiet mode, or an inactive hook; silence alone does not tell you which.

Keep an intentional choice

For a confirmed exception, record the specific value and why it belongs:

/impeccable hooks ignore-value overused-font Inter --reason "Brand font"

The exception is shared with manual detector scans. Configuration & ignores explains narrower file scopes, private exceptions, and broader rule or file exclusions.

Setup and troubleshooting details

Supported files and skipping installation

Built-in file types are .tsx, .jsx, .html, .vue, .svelte, .astro, .css, .scss, .sass, .less, .ts, and .js. Plain JS and TS stay quiet unless a design issue is found.

Add server-side template types through detector.extensions.

To skip hook setup for one install or update:

npx impeccable install --no-hooks
npx impeccable update --no-hooks
Quiet mode, logs, and environment overrides

Runtime options live under hook in .impeccable/config.json. Local overrides, including installation consent, live in the gitignored .impeccable/config.local.json.

hook.quiet: true silences clean and pending acknowledgements while keeping new findings. It does not turn checks off.

For debugging, set hook.auditLog to a path such as .impeccable/hook.ndjson. Each invocation writes one JSON line. Leave logging off during normal work.

IMPECCABLE_HOOK_DISABLED, IMPECCABLE_HOOK_QUIET, and IMPECCABLE_HOOK_LOG override the corresponding config settings for processes that receive those environment variables. Status reports relevant overrides.

A malformed hook manifest prevents setup

Install and update stop rather than overwrite a malformed manifest. Inspect the file first. If you choose to replace it, rerun with --force; Impeccable backs up the malformed file with a .bak extension before replacing it.