--- import Base from '../layouts/Base.astro'; import LiveDemoPalette from '../components/LiveDemoPalette.astro'; import Testimonials from '../components/Testimonials.astro'; import LiveDemoGbar from '../components/LiveDemoGbar.astro'; import '../styles/main.css'; import '../styles/sub-pages.css'; import '../styles/home-kinpaku.css'; import '../styles/home-rebuild.css'; import '../styles/testimonials.css'; // Hero background candidates: pulled from /design-system's candidate folders // so the homepage switcher and the design-system gallery stay in sync. The // switcher panel below the hero lets you cycle through them and pick one; // selection persists in localStorage. Remove the switcher block + this loader // once the hero is locked in. // Hero is /assets/neo-kinpaku/candidates/finalists/m-01-v2-01.png (referenced from CSS). // Previous hero: /assets/neo-kinpaku/kintsugi-hero-v3.png ---

The missing design
vocabulary for agents.

It's why AI frontends all share one look: no words for hierarchy, contrast, or restraint. Impeccable gives your agent the designer's vocabulary, and gives you the same commands, so you both stop guessing and start directing, live, in your production codebase.

Get started How it works
localhost:3000
Generating variants…
1 / 3
Variant 3 written to source

Desloppification

Impeccable strips the AI slop tells and bad defaults out of every design discipline, from type to motion to copy. A skill can't make the model a better designer; it can clear the reflexes that make its output look generated.

Browse the full catalog npx impeccable detect src/

The Language

23 commands give you a shared design vocabulary with your AI. Each maps to one discipline (/typeset for type, /colorize for color, /animate for motion), so you can ask for the exact thing without explaining it. Pick any to see it in action, or browse the full reference →

Ready to drop in

01

Respects your design system.

Inherits your tokens, components, and conventions instead of overwriting them. New work fits the system, not the model's defaults.

/impeccable polish : scanning codebase
› Walking src/…
✓ src/styles/tokens.css  14 colors, 6 font sizes, 7 spacing steps
✓ tailwind.config.ts  theme.extend merged
✓ src/components/  34 components
    · Button: primary, secondary, ghost, destructive
    · Card: 3 variants, 8px / 16px radii
    · Input, Select, Dialog, Toast, Table…
✓ DESIGN.md  brand rules loaded
→ Matching your system. Not inventing one.
02

Real product context.

Captures the brief once, in PRODUCT.md. Every command reads it before designing.

PRODUCT.md Loaded on every command
Users SREs on call, reading fast, often in the dark.
Register Product. Design serves the task.
Brand voice Calm, clinical, no hype.
Anti-references Purple gradients. Glassmorphism. "Boost your productivity."
03

Travels as DESIGN.md.

/impeccable document writes one in the Google Stitch format. Your visual system becomes portable.

DESIGN.md Google Stitch spec
Primaryoklch(78% .12 82)
WordmarkSpaced 400
IM
Avenir Next
BodyRegular 400
Aa
Avenir Next
Components34
Primary Ghost
Email address
Readable by every DESIGN.md-aware tool.
04

Tuned to the agent you actually use.

Plays to each agent's strengths and around its weaknesses. Below: Codex used image generation to draft Neo Mirai before /impeccable craft turned it into shipped code.

01 · Visualize Auto-generated hi-fi landing-page mock in editorial warm-paper style.
02 · Shape Auto-generated brand toolkit: identity lockups, palette, type, icon system, and application mocks for a fictional AI design conference.
03 · Live build Finished Neo Mirai website hero and agenda, implemented from the generated conference mock.

Read the case →  ·  Open the live build →

05

Brand work is not product UI.

A landing page and a dashboard play by different rules. Impeccable runs in two registers, brand or product, and every command knows which.

Brand mode
Issue 04
Shape the story.
Product mode
Users12,482
Active now1,207
Conversion4.8%
06

Block slop before it ships.

A detector you can wire into PR checks. 49 deterministic rules, no LLM, exit codes the build can read.

feat/pricing-page ✗ failing
$ npx impeccable detect src/
✗ src/Hero.tsx:42 gradient-text
✗ src/Card.tsx:8 side-stripe-border
✗ src/Button.tsx:17 ai-color-palette
3 anti-patterns · exit 1
07

Iterate in your live app. BETA

Pick any element in your running dev server, leave a comment or a stroke, hit Go. Three production-quality variants swap in via your framework's HMR.

localhost:3000
section.hero more elegant
h1
bolder ×3

See how Live Mode works →

08

Accept writes to source.

Variants land in your real file as an ordinary edit, not a throwaway mock. A diff you can review, commit, or undo.

✓ Wrote src/Hero.astro
- "Welcome to Our Hotel"
+ "Where the coast forgets time"
- "Book Now"
+ "Reserve your stay"

Get started

Install via

On the GitHub Copilot app? Impeccable is built in. Skip the install and enable it under Settings → Experimental.

npx impeccable install

Installs the build tailored to your harness and model. Requires Node 22.12+.

Why one command, many builds
impeccable Claude Code hooks + subagent Cursor pre-edit hook Gemini CLI + Gemini-tuned slop rules Codex CLI + Codex-tuned slop rules

Same skill, recompiled per target. The part that matters: builds for models with known tells carry extra slop rules banning that model's habits. The Gemini build kills its image-on-hover motion; the Codex build refuses ghost-cards and over-rounding. Native hook wiring and a subagent ship too, where the tool supports them.

First run
/impeccable init
Update
npx impeccable update

Works with Cursor, Claude Code, GitHub Copilot, Gemini CLI, Codex CLI, and every other major AI coding harness.

Read the setup guide · See what's new · Got questions?

Learn more: Getting started · Designing with Impeccable · command docs