UI UX Pro Max は、AI コーディングエージェントにデザインの知識を加えるスキルです。README には、Claude Code、Cursor、Windsurf、Codex CLI、Gemini CLI、GitHub Copilot など、20以上の対応エージェントが載っています。
リポジトリにある基本版は、MIT ライセンスの無料オープンソースです。2026年10月26日時点で GitHub のスター数は約140,000でした。ブランド、ロゴ、スライドのデザインを含む有料のプレミアム版もあります。
仕組み
画面まわりの作業を頼むと、スキルが自動で動きます。製品の種類、ビジュアルスタイル、配色パレット、ランディングページのパターン、フォントの組み合わせの5つを同時に検索します。続いて推論のステップが製品の種類に応じたルールを当てはめ、完全なデザインシステムを組み立てます。
このデザインシステムは、ページ構成、スタイル、正確な色、フォント、エフェクト、避けるべきこと、納品前のチェックリストを示します。たとえば銀行なら、AI にありがちな紫とピンクのグラデーションを避けるよう警告します。そのあとで初めてエージェントがコードを書きます。
中身
- 検索できる79の UI スタイル。うち50が標準で有効で、グラスモーフィズム、ミニマリズム、ブルータリズム、ベントーグリッド、ダークモードなどがあります。
- 192の製品タイプ。それぞれに専用の配色パレットとデザインルールがあります。
- Google Fonts の読み込み付きの74のフォントの組み合わせと、34のランディングページのパターン。
- 119の UX ガイドライン。アクセシビリティのルールや、切れずに折り返すテキストなども含みます。
- React、Next.js、Vue から SwiftUI、Flutter、Jetpack Compose まで、22の技術スタック向けの指針。スタックを指定しなければ HTML と Tailwind を使います。
先に知っておきたいこと
検索スクリプトには Python 3 が必要です。標準ライブラリだけを使い、ネットワーク通信はしません。スキルはデザインの指針を示すもので、既存のアプリを勝手に書き換えはしませんが、新しいスタイルをコンポーネントごとに適用するようエージェントに頼むことはできます。
インストール方法
Claude Code の場合:
/plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill
/plugin install ui-ux-pro-max@ui-ux-pro-max-skill
ほかのエージェントでは、コマンドラインツールを使います:
npm install -g ui-ux-pro-max-cli
uipro init --ai cursor
cursor の部分は使っているエージェントに置き換えます。たとえば claude、codex、gemini。あとは普通の言葉で頼みます:「自分の SaaS 製品のランディングページを作って」。