AI 設計システム CLI
Claude Code と Cursor のための
デザインインテリジェンス
設計システムは、もはやデザイナーが Figma で組み立てる成果物ではなく、AI のセッションが参照するデータレイヤだ。ux-skill は、Python 製の CLI として、Claude Code、Cursor、Windsurf、その他 14 個の IDE にデザインインテリジェンスを供給する。1,182 件のカタログ、145 個の決定論的な正規表現ルール、131 件のブランド仕様、22 個のコマンド——一つのインストールで全部届く。
なぜ「設計システム CLI」なのか
従来の設計システムは、Figma のライブラリと、別途デプロイされた Storybook と、長年にわたって更新が止まっているマークダウンの規約集の三点セットだった。設計とコードの間には、人間が翻訳する空白があった。AI コーディングの登場で、この空白がボトルネックになった。モデルは Figma を見ない。読まれない規約集を読まない。モデルが読むのは、ファイルシステムの上にある何かか、もしくは IDE の中に注入されたシステムプロンプトだ。
設計システム CLI のアイデアは単純だ。システムを、AI のセッションに直接届くデータ構造として配布する。JSON のカタログ、CSS のトークンファイル、マークダウンのルール、MCP のツール——これらをひとつのコマンドで生成し、設計の選択肢が会話の中で「使える」状態にする。Figma は人間の側の真実のままにしておけばいい。CLI は機械の側の真実を担う。
ux-skill のコマンド設計
コマンドは大きく 4 系統に分かれている。発見、推薦、適用、検証。それぞれが小さな関心事を持っていて、ひとつのワークフローとして連鎖する。
| 系統 | コマンド | 役割 |
|---|---|---|
| 発見 | ux discover | 10 フィールドのブリーフをフォーシングファンクションとして埋める。即興は禁止。 |
| 推薦 | ux recommend | 5 つの並列検索（業界、スタイル、パレット、書体、モーション）を統合し、整った設計システムを返す。 |
| 適用 | ux design · ux component | 推薦された設計に対して、画面とコンポーネントを生成する。 |
| 適用 | ux persist save | MASTER.md、tokens.css、manifest.json をファイルシステムに永続化。 |
| 検証 | ux lint | 145 個の正規表現ルールで指紋を検出。CI で非ゼロ終了。 |
| 検証 | ux fix | リンターが拾った指紋を、自動でパッチする。 |
| 参照 | ux brand | 131 件のブランド仕様（Stripe、Linear、Vercel など）を参照グラマーとして引く。 |
全部で 22 個のコマンドがある。ここに列挙したのは中核だけだ。残りは、特定の局面（ダッシュボード、フォーム、データ表示、a11y、コピー）に特化したサブコマンド群で、必要なときだけ呼び出される。
3 つのインストール経路
同じ Python パッケージが、3 つの経路でユーザーの IDE に届く。プラットフォームによってインストールの「正解」が違うため、3 通り用意してある。
# Claude Code のマーケットプレイス経由 $ /plugin marketplace add Laith0003/ux-skill $ /plugin install ux@ux-skill # pip — Cursor、Windsurf、Cline、Continue、Codex のターミナルから $ pip install uxskill # npx — Node ファーストなワークフロー、CI $ npx uxskill@alpha init
どの経路でも、エンジンは同じだ。1,182 件のカタログ、120 個のルール、131 件のブランド仕様、22 個のコマンドに変更はない。MCP サーバーとしても起動できるので、対応している IDE（Claude Desktop、Cursor、Windsurf、Cline、Continue）からはツール呼び出しとして直接届く。
60 秒以下のパイプライン
ブリーフから永続化された設計システムまでの時間は、エンジン側の計算で約 300 ミリ秒だ。人間の時間は、10 フィールドのブリーフを丁寧に埋める数分にすべて吸収される。短く言えば、人間がよく考える時間が 100%、機械が考える時間は誤差だ。
# 1. ブリーフ — 即興禁止の 10 フィールド $ uxskill discover > product: 配送ルート最適化 SaaS > audience: 中堅運送会社のオペレーション部門 > tone: 産業的、簡潔、感情を排する > ... # 2. 推薦 — 5 並列検索を統合 $ uxskill recommend > system: industrial-restrained > palette: stone-50 / ink-900 / accent-electric > type: Fraunces (display) + Inter (body) # 3. 永続化 — MASTER.md / tokens.css / manifest.json $ uxskill persist save .uxskill/ > written 3 files in 38ms # 4. 検証 — 145 ルールで CI ゲート $ uxskill lint apps/web/src --threshold high > [OK] 142 files scanned in 412ms · 0 findings at threshold high
この一連の流れの中で、LLM への呼び出しは recommend ステップを除いてゼロだ。リンターは決定論的で、ローカルのファイルシステムだけを見る。トークンの消費は 推薦エンジンの構造 に書いた通り、人間が書いたブリーフの長さだけに依存する。
設計システムは、AI のセッションが「読む」ものになった。CLI は、その読み口を作る。
他のツールとの位置関係
Claude Code のプラグインマーケットプレイスには、すでに有力な設計プラグインがいくつかある。ui-ux-pro-max は 84k スター、taste-skill は 25k スター。これらは推薦器に強い。ux-skill は 14 スターと小さいが、リンターと MCP サーバーをセットで持っている点が違う。2026 年版の Claude Code 設計プラグインのランキング で詳しく比較した。
非対称性は「強制力」だ。推薦器は床を上げ、リンターは天井を決める。両方が必要だ。145 個の正規表現ルール の中身は、もう一本の記事で全部開示している。
CLI は床と天井を作る。センスは作らない。
このツールが解決するのは「指紋」と呼ばれる構造的な既定値だ。Inter を見出しに使う、紫から青へのグラデーション、3 つの同一カード——これらはどの AI も同じように到達する場所で、正規表現で検出できる。リンターはここを止める。
「このセクションのリズムが悪い」「このコピーが冷たい」——これは正規表現の管轄ではない。これは人間か、モデルの判断が要る。ux-skill はクリティーク用のコマンド（ux critique）も持っているが、それは CI ではなくエディタの中で、必要なときに呼ばれる。