Impeccable — это open-source агент-скилл, который устанавливается в AI-кодинг-инструмент и превращает разговор с моделью из «нарисуй мне лендинг» в управляемый процесс: 23 команды, 7 справочных файлов, две точки общей памяти (PRODUCT.md и DESIGN.md), Live Mode для итераций в браузере и детектор из 41 правила, который ловит «AI-slop» без LLM. На GitHub — 25 000+ звёзд, лицензия Apache 2.0, актуальная версия 3.5.0 (конец мая 2026). Работает в Cursor, Claude Code, Codex CLI, Gemini CLI, VS Code Copilot и ещё в семи harness’ах. По сути это словарь и процесс, а не готовая дизайн-система: скилл резко поднимает потолок AI-генерации, но требует, чтобы вы один раз сели и осознанно заполнили PRODUCT.md.

Ключевое правило: AI-модели натренированы на одних и тех же SaaS-шаблонах, и без явного словаря выдают одинаковый «AI-slop» — Inter, фиолетовый градиент, карточки в карточках, серый текст на цветном фоне. Impeccable даёт этот словарь и набор команд, чтобы вывести результат в продакшен-качество.

Что это

Impeccable (по-русски «Безупречный») — это AI-скилл (agent skill) в смысле Anthropic Agent Skills: устанавливается в ваш AI-кодинг-инструмент, после чего в чате появляется команда /impeccable с 23 субкомандами. Каждая отвечает за конкретную дисциплину: типографику, цвет, движение, разметку, копирайт, анти-паттерны, аудит, полировку, итерацию в браузере. В основе — расширение оригинального frontend-design от Anthropic, переписанное автором на собственном eval-фреймворке: один и тот же бриф прогонялся через frontier-модели со скиллом и без, и замерялась степень «коллапса в монокультуру». Главная находка — anti-attractor процедура, которая заставляет модель сначала перечислить и отбросить свои дефолтные рефлексы (Inter, фиолетовый градиент, скруглённый icon-tile над каждым заголовком), и только потом выбирать.

Версия 3.5.0 (28–29 мая 2026) — самое крупное обновление с момента запуска. Скилл научился компилировать правила под конкретный harness (Codex и GPT-5.5 получают инструкции против ровно тех дефектов, что выдают именно они, и других моделей эти правила не касаются — ни один другой дизайн-скилл так не делает). Новый проект и существующая кодовая база теперь обрабатываются по-разному: на чистом листе берётся один seed-цвет из 129 вручную отобранных якорей (у каждого свой mood и стратегия композиции) и руками строится палитра; на существующем коде сначала читаются ваши токены, тема и компоненты, чтобы не сломать айдентику. Live Mode из Alpha ушёл в Beta, детектор переписан без jsdom и стал примерно в 20 раз быстрее (0,34 с против 6,8 с на корпусе из 160 файлов), а в новой версии 41 правило. Параллельно проведён bias mining по 190 примерам — часть дефектов порождали собственные строки скилла, и их вырезали. Забанен бежево-кремовый фон (тот самый «claude beige»), который срабатывал в 74% случаев на GPT.

Зачем нужно

  • Снять «AI-slop» в AI-фронтенде. Скилл ломает дефолтный рефлекс модели выдавать Inter, фиолетовый градиент, карточки в карточках — каждое правило детерминировано и проверяемо.
  • Превратить бриф в управляемый процесс. Вместо одного гигантского промпта — 23 узкие команды (init, shape, craft, polish, audit, harden, clarify, live и т.д.), каждая отвечает за свою дисциплину.
  • Зафиксировать продуктовый контекст один раз. PRODUCT.md (аудитория, бренд-голос, регистр, anti-references) и DESIGN.md (палитра, типографика, токены, компоненты) — общая память, которую читает каждая последующая команда. Дрейф в «modern SaaS» останавливается.
  • Полировать легаси AI-код. /impeccable document вытаскивает токены из существующей кодовой базы в DESIGN.md, /impeccable polish <area> выравнивает под систему — это не редизайн, а приведение к общему словарю.
  • Поставить CI-гейт против регрессий. npx impeccable detect src/ --json ловит регрессионные паттерны (Inter в новых файлах, фиолетовые градиенты, карточки в карточках) без LLM, за миллисекунды на файл.
  • Делать design research бесплатно. Chrome-расширение подсвечивает анти-паттерны на любом сайте — локалхосте, staging, production, у конкурентов. Альтернатива подпискам на Mobbin/Refero за деньги.

Как устроено

Impeccable — это не один файл, а пакет: справочники, команды, общая память и отдельные инструменты. Сборка компилируется под конкретный harness, поэтому одна и та же версия 3.5 для Codex и для Claude Code физически отличается.

7 справочных файлов

Загружаются перед каждой командой и формируют общий контекст.

ФайлО чём
typographyType-системы, font pairing, modular scales, OpenType-фичи
color-and-contrastOKLCH, тинтованные нейтрали, dark mode, доступность контраста
spatial-designСистемы отступов, гриды, визуальная иерархия
motion-designEasing-кривые, стаггеринг, reduced motion
interaction-designФормы, focus-стейты, лоадинг-паттерны
responsive-designMobile-first, fluid design, container queries
ux-writingЛейблы кнопок, тексты ошибок, empty states

23 команды

Все вызываются через /impeccable <command> <target>. Можно «запинить» часто используемую через /impeccable pin audit — тогда /audit станет отдельным шорткатом. Пустой /impeccable без аргументов теперь не показывает статичное меню, а читает проект, ваш незакоммиченный git-tree и последний critique и предлагает 2–3 самые ценные команды с обоснованием.

ГруппаКоманды
Setup и контекст (4)init (бывший teach, работает как алиас), document, extract, shape
Создание и итерация (4)craft, live (Beta), critique, audit
Полировка и финал (3)polish, harden, onboard
Выразительность (5)bolder, quieter, distill, delight, overdrive
Точечные дисциплины (6)typeset, colorize, layout, animate, adapt, optimize
Копирайт и UX (1)clarify

PRODUCT.md и DESIGN.md как общая память

Два файла в корне проекта, которые читает каждая команда перед генерацией:

  • PRODUCT.md — стратегический слой: аудитория, бренд-голос, регистр (brand vs product), anti-references (например, «не как Vercel-лендинг»). Создаётся через /impeccable init за один скан кодовой базы.
  • DESIGN.md — визуальный слой в формате Google Stitch: палитра, типографика, elevation, компоненты, do/don’t. Совместим с другими DESIGN.md-aware инструментами.

Эти файлы решают главную проблему AI-генерации — дрейф в «modern SaaS». Каждая последующая команда стартует не с чистого листа, а с явных констант продукта.

Live Mode (Beta)

Итерации прямо в браузере, в той кодовой базе, которую вы реально шипите. В 3.5 режим вышел из Alpha в Beta и работает на двух масштабах. Запускается /impeccable live.

  • Steer bar — правка всей страницы. Вводите (или надиктовываете) направление в новую панель Steer, и агент читает страницу целиком и правит её на месте, без выбора элемента и без перебора вариантов.
  • Точечная правка элемента. Кликаете по элементу, описываете правку обычными словами и принимаете вариант прямо в исходник.
  • Правка текста на месте. Меняете текст элемента прямо в браузере; по Apply субагент переписывает реальный исходник, из которого он рендерится, и чинит всё, что было к нему привязано (например, лейблы карточек, которые заодно служат ключами картинок).
  • Insert mode — добавляет совершенно новые элементы между уже существующими.

Работает на Vite, Next.js (включая монорепо), SvelteKit, Astro, Nuxt, умеет автоматически патчить strict-CSP. Восстановление переживает HMR, скрытые hero-блоки и оверлеи дев-тулзов; экспериментальный streaming poll сокращает отклик с секунд до долей секунды. Команды устойчивой сессии: live status, live resume, live complete.

CLI и Chrome-расширение

Два дополнительных инструмента, не требующих AI-harness:

  • CLI: npx impeccable detect src/ — детерминированный детектор анти-паттернов без LLM и без API-ключа. В 3.5 движок HTML/CSS переписан с нуля на htmlparser2 и настоящем резолвере CSS-каскада вместо jsdom: на корпусе из 160 файлов он стал примерно в 20 раз быстрее (0,34 с против 6,8 с, ~2 мс на файл). Движок без зависимостей и вшит прямо в скилл, чтобы работать инлайн. Правил теперь 41 в одном каноническом реестре, который питает CLI, расширение, critique и эвалы. Флаг --fast объявлен устаревшим: полный скан и так покрывает все правила, флаг принимается, но игнорируется. JSON-вывод для CI и pre-commit хуков; сканит локальные файлы, HTML и публичные URL через Puppeteer.
  • Chrome-расширение: иконка в тулбаре подсвечивает анти-паттерны прямо на любом сайте — на локалхосте, staging, production или у конкурентов. Движок тот же, что в CLI. В настройках появились тумблеры по каждому правилу: любое можно включить или выключить, они сгруппированы по AI tells и Quality и синхронизируются между браузерами.

Image-first генерация

С версии 3.0 скилл использует диффузионные модели для бренд-работ. /impeccable shape рисует toolkit как настоящие картинки (палитра, типографика, мудборд), /impeccable craft пре-рендерит хи-фай мок и ведёт код к нему. В деле — GPT Image 2, Nano Banana Pro, Imagen 4 Ultra. Самый сильный пайплайн — в Codex с GPT 5.5.

Поддерживаемые инструменты

Сравнение с соседями

Impeccable не один в своём роде — есть несколько скиллов и инструментов, которые тоже борются с AI-slop. Они закрывают разные слои задачи, поэтому не конкурируют, а дополняют друг друга.

ИнструментСильная сторонаКогда выбирать
Impeccable23 команды + 7 справочников + Live Mode (Beta) + детектор из 41 правила (CLI/Chrome)Полный продакшен-цикл AI-фронтенда: от брифа до полировки
Anthropic frontend-designБазовый скилл, ~277k установок, оригинал, на котором всё начиналосьМинимальный entry-level, если хватает дефолтов и не нужны команды
Refero StylesГотовые DESIGN.md из реальных продуктовКогда нужен формальный «дизайн-вкус» как файл, а не словарь команд
PencilАгентный канвас с MCP внутри IDEКогда работа ведётся через визуальный канвас, а не через CLI-команды
huashu-designТерминал как дизайн-студия, китайский подходАльтернатива от другой школы; см. блог-разбор

Impeccable и Refero Styles — два слоя одного контура. Refero Styles даёт референс: «возьми вот этот стиль как файл». Impeccable даёт процесс: «вот словарь и команды, которыми ты этот стиль реализуешь и проверяешь». Пользоваться можно вместе.

11 AI-кодинг-сред:

  • Cursor (требует Nightly + Agent Skills в настройках),
  • Claude Code (плагин-маркетплейс или прямое копирование),
  • OpenCode,
  • Pi,
  • Gemini CLI (preview-версия + включить Skills в /settings),
  • Codex CLI (через /skills или $impeccable),
  • VS Code Copilot,
  • Kiro,
  • Trae (China и International),
  • Rovo Dev (от Atlassian),
  • Qoder.

Когда использовать

Impeccable закрывает восемь практических сценариев. Ниже — таблица «ситуация → сценарий → какие команды работают».

СценарийЧто делаемКакие команды
Новый проект с нуляКлассический арк автора: init → shape → craft. Сначала /impeccable init собирает PRODUCT.md (аудитория, бренд-голос, anti-references). Потом /impeccable shape рисует мудборд и hi-fi мок как картинки. Потом /impeccable craft ведёт код к этому моку. Каждая последующая команда читает PRODUCT.md и DESIGN.md, и output не уплывает в generic SaaS.init, shape, craft
Полировка чужого/легаси AI-кодаЕсли пришла кодовая база, написанная без скилла, и она выглядит как «AI-slop»: запустите /impeccable document, чтобы извлечь токены в DESIGN.md, потом /impeccable polish <area> по разделам. Это не редизайн, а выравнивание под систему.document, polish
Pre-ship gauntlet перед релизомАвтор предлагает три команды в очередь: audit → clarify → harden. Audit ловит технику (a11y, performance, респонсив), clarify чистит копии, harden закрывает edge cases (i18n, error states, переполнение текста).audit, clarify, harden
Точечная правка «что-то не так, не могу описать»Когда видно, что элемент кривой, но не получается сформулировать: /impeccable live, тычете в элемент, рисуете штрих, получаете три варианта.live
Critique без редизайна/impeccable critique <area> — UX-ревью с разбором иерархии и ясности. Не правит ничего, только говорит что не так. Полезно перед демо и инвест-встречами.critique
CI/CD-гейт против AI-slopПодключаете CLI: npx impeccable detect src/ --json → парсите вывод → блокируете PR с regression-патернами (Inter в новых файлах, фиолетовые градиенты, карточки в карточках). Никакого LLM в pipeline не нужно.CLI detect
Аудит конкурентовChrome-расширение Impeccable работает на любом сайте. Открыли продукт конкурента — увидели подсветку anti-patterns и хороших решений. Бесплатный design research без подписок на Mobbin/Refero.Chrome-расширение
Pin-команды как личный наборЕсли в вашем контуре полезно постоянно дёргать audit и polish — /impeccable pin audit и /impeccable pin polish дают шорткаты /audit и /polish без потери единого namespace.pin

Пример

Рекомендуемый способ — CLI-инсталлер из корня проекта:

npx impeccable skills install

Команда сама определяет ваш harness и кладёт сборку, скомпилированную именно под него (.claude/skills/, .cursor/skills/ и т.д.), — оттуда и берутся harness-specific правила. Универсальный npx skills add pbakaus/impeccable тоже работает, но ставит одну общую сборку для всех инструментов, а не скомпилированную под ваш.

Для Claude Code есть плагин-маркетплейс:

/plugin marketplace add pbakaus/impeccable

Дальше открывается /plugin в Claude Code. После установки — пишете /impeccable и получаете автодополнение по всем 23 командам.

Для точечной установки можно скачать ZIP под конкретный harness с сайта проекта или скопировать из репозитория dist/<harness>/. У Codex субагент-ассет-продюсер теперь лежит внутри папки agents/ самого скилла и подхватывается автоматически — отдельная копия в .codex/agents/ больше не нужна.

После установки первый запуск /impeccable init собирает PRODUCT.md и предлагает DESIGN.md — именно здесь скилл узнаёт, что вы за бренд, какой у вас регистр (brand vs product) и какие anti-references держать в голове. С этого момента каждая команда стартует с этих констант и не сваливается в generic SaaS.

Каталог антипаттернов

Полный список из 41 детерминированного правила, которые детектор Impeccable ловит без LLM. Сгруппировано по источнику: сначала базовый набор, потом 14 новых правил, добавленных в версии 3.5.

Базовый набор (27 правил)

  • Шрифты-дефолты: Inter, Arial, system-fonts
  • Italic-serif hero h1 (Fraunces, Recoleta, Newsreader, Playfair, Cormorant, Tiempos) как первичный заголовок
  • Eyebrow-chips над h1 — uppercase letter-spaced лейбл прямо над hero-заголовком
  • Серый текст на цветном фоне
  • Чистый чёрный или серый без подкраски
  • Карточки в карточках
  • Bounce / elastic easing
  • Rounded-square icon tile над каждым заголовком
  • Фиолетово-синий градиент
  • Боковые табы с borders
  • Dark glows вокруг интерактивных элементов
  • Маленькие touch-targets
  • Скипнутые heading-уровни
  • Переполненный padding
  • Длинные строки текста без breakpoints
  • Cramped spacing в карточках
  • Missing focus-states
  • Generic placeholder-копирайт («Welcome to our amazing platform»)
  • Кнопки без состояний
  • Непоследовательные размеры между похожими элементами
  • Избыточные тени
  • Чистый чёрный текст без подцветки в брендовых секциях
  • Identical visual weight у CTA и второстепенных кнопок
  • Sub-100% opacity на критичных лейблах
  • Отсутствие визуальной иерархии в группах
  • Mixing 3+ разных шрифтов в одной композиции
  • Слишком яркие hover-states, раздражающие пользователя

Новые правила 3.5 (14 правил)

  • cream-palette — бежево-кремовый фон («claude beige»)
  • em-dash-overuse — злоупотребление длинным тире
  • marketing-buzzword — маркетинговые баззворды
  • numbered-section-markers — нумерованные маркеры разделов
  • aphoristic-cadence — афористичный ритм текста
  • theater-slop-phrase — «театральные» slop-фразы
  • oversized-h1 — гигантский h1
  • extreme-negative-tracking — экстремальный отрицательный трекинг
  • gpt-thin-border-wide-shadow — тонкая рамка с широкой тенью в стиле GPT
  • repeating-stripes-gradient — повторяющиеся полоски-градиенты
  • image-hover-transform — transform картинки на hover
  • broken-image — битые картинки
  • text-overflow — переполнение текста
  • clipped-overflow-container — обрезанный контейнер

Заодно забанены all-caps eyebrow-лейблы, больше трёх шрифтов и введён жёсткий пол по контрасту.

Все 41 правило живут в одном каноническом реестре, который питает CLI (`npx impeccable detect`), Chrome-расширение, `/impeccable critique` и эвалы. Тумблеры в настройках расширения позволяют включать/выключать любое правило, они сгруппированы по AI tells и Quality и синхронизируются между браузерами.

Ограничения

Ограничения

Что учитывать

Перед тем как ставить Impeccable как серебряную пулю, разложите эти грабли по полочкам.

Это не готовая дизайн-система.

Impeccable — словарь и процесс, а не библиотека компонентов. Если у вас её нет, скилл поможет её собрать через /impeccable extract и /impeccable document, но за вас не сделает.

Live Mode в Beta, не в релизе.

Стабильно работает на Vite, Next.js, SvelteKit, Astro и Nuxt; в экзотических конфигурациях (нестандартный CSP, тяжёлые портал-модалки, repeated identical-class siblings) бывают баги. В монорепо с 6+ фреймворками может потребоваться ручная правка.

Image-first заточен под Codex с GPT 5.5. На других harness’ах работает скромнее:

где-то генерация недоступна вообще, где-то — без iterative-режима. Если у вас ключевой сценарий — генерация мудбордов и hi-fi моков, проверьте на своём стеке заранее.

Не отменяет осмысленного дизайнера.

Скилл резко поднимает потолок AI-генерации, но если в брифе нет ясности про продукт и аудиторию — даже с PRODUCT.md результат будет компетентным, но безадресным.

Анти-паттерны срабатывают на легитимных кейсах.

Editorial и magazine-сайты, которым исторически положены italic-serif heroes, тоже подсвечиваются — нужны ручные исключения в тумблерах Chrome-расширения.

Установка в Cursor требует Nightly канала.

Не все команды захотят пересаживаться на nightly-сборку ради одного скилла.

Версионирование стремительное.

v1 вышел в феврале 2026, v3 — в апреле, v3.5.0 — в конце мая; ломающие изменения возможны. С 3.5 скилл сам предлагает обновиться в первой сессии дня; если хотите контролировать момент — отключите авто-проверку через IMPECCABLE\_NO\_UPDATE\_CHECK=1 и запускайте npx impeccable skills update руками.

Антипаттерны

Антипаттерны

Чего не делать

Здесь — детерминированные правила, которые детектор ловит без LLM. 41 правило в одном каноническом реестре питает CLI, расширение, critique и эвалы.

Ставить скилл и не заполнять PRODUCT.md

без init каждая следующая команда стартует с пустого листа, и результат остаётся generic SaaS, как и без скилла.

Использовать `npx skills add pbakaus/impeccable` вместо harness-aware установки

универсальный инсталлер ставит общую сборку и теряет harness-specific правила, ради которых вся 3.5 и затевалась.

Применять анти-паттерны к editorial и magazine-сайтам без исключений

italic-serif hero, eyebrow-chips и serif-параграфы там не slop, а жанр; тумблеры Chrome-расширения существуют именно для таких случаев.

Гонять Live Mode на проекте с экзотическим CSP без подготовки

strict-CSP патчится автоматически, но в монорепо с 6+ фреймворками восстановление может не пережить HMR-цикл.

Рассчитывать на Image-first в harness без диффузионной модели

где-то генерация недоступна, где-то работает без iterative-режима; проверяйте на своём стеке заранее.

Пропускать anti-references в PRODUCT.md

это единственный способ сказать скиллу «не как Vercel-лендинг» в явном виде; без них модель всё равно скатится в монокультуру.

Ждать от скилла готовую дизайн-систему

Impeccable словарь и процесс, а не библиотека компонентов; библиотеку собираете вы через extract и document.

Ставить CLI в CI без pre-commit проверки

npx impeccable detect src/ --json отлично ловит регрессии в PR, но без pre-commit разработчик увидит «фиолетовый градиент» уже после мерджа.

Работать с фронтендом на Cursor Stable

стабильный канал не включает Agent Skills, нужна Nightly-сборка.

Игнорировать bias mining самого скилла

в 3.5 вырезали часть дефектов, которые порождали собственные строки скилла; за фиксом стоят данные, а не мнение.

Чеклист

Чеклист

Проверка перед запуском

Прежде чем считать Impeccable «встроенным в работу», пройдитесь по этим пунктам.

Скилл установлен под ваш harness

npx impeccable skills install положил сборку в .claude/skills/, .cursor/skills/ или соответствующую папку.

PRODUCT.md заполнен осознанно

аудитория, бренд-голос, регистр, anti-references; не «проставлены галочки», а реально прописано.

DESIGN.md сгенерирован — для нового проекта через shape

craft, для существующего через document; дизайн-токены и палитра зафиксированы.

С базовым сценарием определились — для нового проекта shape

craft → polish, для существующего polish / critique / audit.

Запинены 2–3 команды в шорткаты

например /impeccable pin audit и /impeccable pin polish, чтобы не печатать префикс.

Chrome-расширение установлено

для аудита продакшена и конкурентов, тумблеры по правилам настроены под ваш жанр.

CLI подключён в CI

npx impeccable detect src/ --json как блокирующий гейт против regression-патернов; флаг --fast больше не нужен.

Авто-обновление настроено

либо оставлено включённым (скилл сам предлагает обновиться), либо раз в спринт запускается npx impeccable skills update руками.

Pre-ship gauntlet описан в runbook — audit

clarify → harden перед каждым релизом, как три обязательных шага.

Команда обучена базовым командам

каждый разработчик знает, что такое polish, audit, clarify, и умеет ими пользоваться без init.

Ссылки

Ссылки

По теме

По теме