Impeccable

Overview

Impeccable addresses a gap that became painfully obvious as AI coding agents got better at writing functional code: the design output is usually mediocre. An agent can build a working React component in seconds, but the spacing is inconsistent, the color choices are arbitrary, the typography hierarchy is flat, and the responsive behavior is an afterthought. Impeccable is Paul Bakaus’s answer — a shared design vocabulary between human and agent that turns vague aesthetic preferences into deterministic, enforceable rules.

The setup flow (/impeccable init) creates a PRODUCT.md file that captures durable product truth: who the audience is, what the product does, the operating context, design constraints, brand voice, and supporting evidence. This file becomes the agent’s design compass — it stops the agent from making generic “looks nice” decisions and grounds every choice in the product’s actual requirements.

Key Capabilities

The 24 design commands give developers precise control over the agent’s design output. /impeccable polish refines an existing UI toward production quality. /impeccable audit runs the full 61-rule detector and reports every violation. /impeccable critique provides opinionated feedback on design direction. /impeccable distill simplifies a busy interface. /impeccable animate adds purposeful motion. /impeccable bolder and /impeccable quieter adjust visual intensity. Each command reads from the product-truth file, so results are consistent with the product’s identity rather than generic defaults.

The detector rules are the backbone. They are deterministic — not LLM-based — which means they produce the same result every time on the same input. Rules cover spacing consistency, color contrast (WCAG AA and AAA), typography hierarchy, layout alignment, responsive breakpoints, animation timing, and accessibility attributes. On supported harnesses, the hook runs these rules automatically after any UI file edit, surfacing findings directly in the agent conversation.

Use Cases

Frontend developers use Impeccable to elevate AI-generated UI from “functional prototype” to “shippable product.” Design-aware teams install it as a quality gate — the detector catches the spacing and contrast issues that slip past code review. Solo developers who lack a dedicated designer use the command vocabulary to iterate on design direction without leaving their agent session. Teams with established design systems use PRODUCT.md to encode their system’s rules so the agent respects them by default.

Considerations

Impeccable is a design-quality layer, not a design system or component library. It works best when paired with an existing UI framework (Tailwind, Radix, shadcn/ui) and focuses on the layer between “the code works” and “the design is production-ready.” The detector rules are opinionated — they encode specific design standards that may not match every team’s preferences, though rules can be configured. Browser preview features require a running dev server.

Who It’s For

Frontend developers and full-stack engineers who use AI coding agents for UI work and want design output that does not require extensive manual cleanup. Teams that want deterministic design quality gates in their agent workflows. Solo builders who need a design co-pilot vocabulary without hiring a designer. Anyone who has looked at AI-generated frontend code and thought “the logic is right but the design is off.”