GitHubは2026年6月22日、AIコーディングエージェント向けのデザイン支援スキル
GitHubのEvan Boyle氏はXで、GitHub CopilotアプリのExperimental settingsで/impeccableを有効化できると投稿している。
GitHub CopilotアプリのSettings内のExperimental画面では、
Impeccableは、Paul Bakaus氏が開発したオープンソースのデザイン支援スキル。GitHub Copilotアプリでは組み込みスキルとしてExperimental画面から有効化できる一方、Claude Code、Codex CLI、Cursorなどでプロジェクトに導入する場合は、プロジェクトルートでnpx impeccable installを実行する。
このスキルは、AIコーディングエージェントとユーザーが共有できるデザイン語彙、プロジェクトごとの文脈、ルールベースの品質チェック、ブラウザ上での視覚的な反復作業を提供する。プロジェクトごとの文脈は、PRODUCT.やDESIGN.などプロジェクト側のファイルとして管理される。
ImpeccableのREADMEによると、AIコーディングツール内で使う初期設定用のスラッシュコマンド/impeccable initは、対象読者やブランドのトーン、避けたい方向性などを尋ね、それらを記録するPRODUCT.を作成する。色、書体、コンポーネントなどのデザインシステムを記述するDESIGN.の作成も提案する。操作用のコマンド群も用意されており、READMEでは、1つの/impeccableコマンド配下に
手元のプロジェクトで/impeccable initを実行してみると[1]、最初の質問で対象がプロダクト寄りか、ブランド/マーケティング寄りかを尋ねられた。そこで対象にしたいHTMLテンプレートと仕上げの方向性を伝えると、Impeccableはその対象に絞ってコードベースを確認した。続いて、PRODUCT.を作成するために次のような項目を順に尋ねられた。
- 対象機能の主な利用者と用途
- 仕上げで避けたいUIの方向性
PRODUCT.に記録するアクセシビリティ目標md - 回答内容で
PRODUCT.を書き出すかmd
その後、PRODUCT.が作成されると、既存のCSSトークンなどをもとにDESIGN.を生成するかを尋ねられた。
DESIGN.を生成後に続けて/impeccable polishを使うと、作成されたPRODUCT.やDESIGN.を読み込んだうえで対象ファイルを調べ、デザイン方針に沿うようにファイルを変更する流れも確認できた。試した例では、HTMLテンプレートに対して、装飾的な背景の削除、フォントスタックの調整、フォーカス/ホバー状態の改善、コピー操作の分かりやすさやアクセシビリティ対応の調整などが行われていた。
Impeccableの主な用途は、AIが生成したUIにありがちな定型的な見た目や品質上の問題を、開発フローの中で見つけて直すことにある。公式サイトでは、紫から青へのグラデーション、カードの入れ子、見出しや本文の強弱が分かりにくい状態、低いコントラスト、意味の薄いモーション、重複したUXコピーなどを
2026年6月22日に公開されたv3.
このバージョンでは、モノレポ対応も強化された。モノレポのルートを開いた場合、Impeccableはリポジトリ内のアプリケーションごとにPRODUCT.とDESIGN.を解決し、各アプリケーション側に定義がない情報はルート側のファイルを参照する。/impeccable liveでは複数のアプリケーションを検出し、どれを対象にするかを確認してから、ライブ状態をそのアプリケーション内で管理する。
その前のv3.DESIGN.がある場合、UI編集後に実行されるフックやCLIコマンドimpeccable detectはローカルのデザインシステムを読み込み、ドキュメント化されたパレット、書体、角丸のスケールなどからのずれを検出する。これにより、一般的なAI生成UIの癖だけでなく、個別プロジェクトのデザイン方針から外れた色、フォント、角丸なども指摘できる。
今回のGitHub Copilotアプリへの組み込みは、Bakaus氏が立ち上げたRenaissance GeekとGitHubのパートナーシップを受けた動きでもある。Renaissance GeekはImpeccableを手がける会社で、Bakaus氏は同社がa16zの支援を受けていることも明らかにしている。