impeccable - Impeccable, дизайн интерфейсов для агента

Когда звать

• Перед тем как агент начнёт верстать новую страницу, лендинг или экран приложения - чтобы сначала записать, для кого продукт и какой у него голос.
• Когда готовая страница выглядит как типовой AI-лендинг и её нужно проверить, упростить, сделать смелее или спокойнее и довести до выпуска.

Что это

Impeccable - открытый скилл для агентов, которые верстают интерфейсы: страницы, лендинги, дашборды, формы, экраны приложения. Автор - Пол Бакаус, лицензия Apache 2.0. Сайт проекта с документацией - impeccable.style.

В README автор прямо пишет, откуда скилл вырос: из frontend-design от Anthropic, первого массового скилла про дизайн для Claude. Impeccable пошёл дальше. Это один скилл, внутри которого 24 команды, режим правки прямо в браузере и проверка готовой вёрстки по 59 правилам, которая работает без модели и без ключа.

Задача та же, что у предшественника: увести агента от вида «это сделала нейросеть». По словам автора, все модели учились на одних и тех же шаблонах, поэтому без подсказок выдают одно и то же: шрифт Inter везде, градиент из фиолетового в синий, карточки внутри карточек, серый текст на цветном фоне, значок в скруглённом квадрате над каждым заголовком.

Как поставить

Основной способ по README - установщик, который нужно запустить из корня проекта:

npx impeccable install

Нужен Node.js - только для самого npx. Установщик находит, какие агенты есть на компьютере (папки ~/.claude, ~/.codex и другие), даёт оставить найденные или выбрать свои, и спрашивает, ставить в этот проект или сразу для всех проектов. Для Claude Code и Codex он ещё ставит в проект хук - он проверяет вёрстку после правок агента. После установки перезапусти агента.

Codex. После установки или обновления открой /hooks и разреши хук проекта - иначе он не заработает. Codex помнит разрешение по содержимому хука, поэтому после обновления может спросить ещё раз.

Claude Code, через каталог плагинов автора. Другой путь из README:

/plugin marketplace add pbakaus/impeccable

Потом открой /plugin и поставь Impeccable из списка.

Обновить: npx impeccable update.

В README есть и другие способы: папкой из репозитория, архивом с сайта, подмодулем git для команды. Плюс инструкции для Cursor, Gemini CLI, GitHub Copilot, OpenCode и ещё десятка программ.

С чего начать

Первой командой в любом проекте автор советует:

/impeccable init

Скилл осмотрит проект, задаст вопросы только о том, чего не нашёл сам, и запишет в файл PRODUCT.md главное о продукте: для кого он, зачем, где им пользуются, какие ограничения, каким голосом говорит. Дальше все команды опираются на этот файл. Визуальное направление выбирается отдельно под каждый экран, а уже сложившаяся дизайн-система проекта записывается в DESIGN.md.

Команды

Все 24 команды зовутся через /impeccable и имя команды. Главные по README:

• craft - полный путь: продумать экран, собрать его и доводить, глядя на результат.
• shape - спланировать экран до кода.
• critique - разбор дизайна: иерархия, понятность, впечатление.
• audit - техническая проверка: доступность, скорость, работа на телефоне.
• polish - финальный проход перед выпуском, сверка с дизайн-системой.
• bolder и quieter - сделать скучный дизайн смелее или кричащий спокойнее.
• distill - убрать лишнее, оставить суть.
• harden - ошибки, длинные тексты, крайние случаи, перевод на другие языки.
• typeset, layout, colorize, animate - шрифты, сетка и отступы, цвет, движение.
• clarify - переписать непонятные тексты интерфейса.
• live - правка элементов прямо в браузере с вариантами на выбор.

Команду можно уточнить словами: /impeccable audit the header или просто /impeccable переделай первый экран. Если какой-то командой пользуешься часто, /impeccable pin audit сделает из неё отдельную команду /audit.

В Codex скилл зовут иначе: открыть /skills или написать $impeccable.

Проверка без агента

У Impeccable есть отдельная программа, которая проверяет готовую вёрстку по 59 правилам без модели и без ключа:

npx impeccable detect src/
npx impeccable detect https://example.com

Она ловит приметы AI-шаблона - фиолетовые градиенты, «прыгающую» анимацию, светящиеся тени - и общие ошибки качества: слишком длинные строки, тесные отступы, мелкие кнопки для пальца, пропущенные уровни заголовков. Для проверки по адресу нужен установленный Chrome, Chromium или Edge. Автор честно оговаривает: чистый результат - это довод, а не доказательство качества. Страницу всё равно нужно посмотреть глазами на телефоне и на компьютере.

Что держать в голове

• Скилл пишет файлы в проект. Рабочие файлы ложатся в папку .impeccable/: скриншоты разборов, состояние режима правки, кэш. Большую часть не нужно хранить в git - готовый блок для .gitignore есть в README. Общие файлы (config.json, design.json и разборы) автор советует оставить в репозитории.
• Режим live только для своих проектов на своём компьютере. Он правит локальную копию через сервер разработки. Подключать его к сайту в интернете автор не поддерживает. И ещё: при правке текстов он может запустить команду из package.json проекта, поэтому в чужом проекте сначала посмотри, что там написано.
• Программа скачивает свой движок. Скилл запускает готовую программу Impeccable: она либо лежит рядом со скиллом, либо скачивается один раз в ~/.impeccable/bin/.

Impeccable и Taste Skill

В каталоге есть соседний скилл - Taste Skill. Оба борются с шаблонным видом, но по-разному. Impeccable - набор команд на все этапы работы над экраном плюс проверка программой. Taste Skill даёт подробные правила композиции, шрифтов и движения. Ставить оба сразу не советуем: правила будут спорить, и агент начнёт метаться. Начни с одного и посмотри результат.

Вопросы и ответы

Это бесплатно? Да, лицензия Apache 2.0.

Чем отличается от frontend-design от Anthropic? Frontend-design - один файл с общим подходом. Impeccable вырос из него, по словам автора, и добавил файл о продукте, 24 команды и проверку программой.

Работает ли в Codex? Да, установщик ставит и туда. Хук в Codex нужно один раз разрешить через /hooks.

Агент не видит скилл после установки. Перезапусти программу. В Codex проверь, что скилл лежит в .agents/skills/ проекта или в ~/.agents/skills/.

Автор и источник

Скилл открытый, чужой, автор - Пол Бакаус, лицензия Apache 2.0. Мы его не меняли. Описание и команды сверены с README репозитория pbakaus/impeccable на 9 октября 2026 года. Проект часто обновляется, поэтому детали сверяй по первоисточнику.