デザイン向け AI スキル厳選 14 選

デザイン分野の AI スキルを 14 件厳選。機能・インストール方法・公式リンク付き。Claude / Cursor / ChatGPT 対応。

カテゴリから探す
プラットフォームから探す
🎨
Cursor無料
Cursor と Figma の深い連携。デザインからコードへの自動変換、コンポーネント認識と生成、ピクセルパーフェクトな再現。
デザインからコード
コンポーネント自動認識
ピクセルパーフェクト
変数とスタイル同期
デザイン
🎭
ChatGPT有料
ChatGPT の会話から直接 Canva デザインを作成。欲しいデザインを伝えるだけで、プロ品質のポスター・スライド・SNS 画像を生成。
会話からデザイン生成
ポスターとスライド
ブランド素材ワンクリック
マルチフォーマット出力
デザイン
🖥️
Claude無料
Anthropic 公式のフロントエンドデザインスキル。「AI っぽさ」を脱した、デザイン性が高くそのまま公開できるモダンな UI を生成。
高品質 UI 生成
タイポと配色体系
レスポンシブ対応
脱 AI テンプレート感
デザイン
🎨
Claude無料
Anthropic 公式のビジュアルデザインスキル。デザイン哲学に基づいてポスター、カバー、カードなどの静的作品を制作し、PNG / PDF で出力。
ポスターとカバー
デザイン原則駆動
PNG / PDF 出力
オリジナルスタイル
デザイン
🎭
Claude無料
あらゆる成果物をワンステップで着せ替え:10 種のプリセットテーマ(配色 + フォント)、ブランドから新テーマの即時生成も可能。
10 種プリセット
ブランド色で即生成
ドキュメント間で統一
フォント配色体系
デザイン
🏷️
Claude無料
会社のブランド規範(カラー、フォント、トーン)をスキル化。以降のドキュメント・スライド・Web ページが自動でブランド準拠に。
ブランドカラー固定
フォント規範の徹底
成果物間の一貫性
自社ブランドに複製可
デザイン
🎨
Claude無料
Hallmark は Together AI 製のデザイン skill で、LLM が生む「AI 臭い」Web を拒否します。各ブリーフごとにマクロ構造を選び、20 のテーマから 1 つを着せ、57 のスロップ検査と出力前の自己批評を通します。だから異なる 2 つのブリーフは、同じテンプレの色違いではなく別々のサイトに見えます。
AI臭のないWebデザイン
20テーマ+57スロップ検査
4動作:生成監査再設計採取
3つの主要agentで動作
デザイン
🖌️
Claude無料
Huashu Design は HTML ネイティブのデザイン skill です。agent に一言伝えると、3〜30 分で納品可能なプロダクトローンチ動画、クリック可能な App プロトタイプ、編集可能な PPT、印刷品質のインフォグラフィックが返ってきます。ブランド素材を渡せばテイストを読み取り、何も渡さなくても 40 種の HTML ネイティブ様式(Web20+PPT20)と 3 系統のロジック顧問が「AI 臭」を防ぎます。Claude Code、Cursor、Codex など agent 横断で使えます。
一言で納品可能なデザイン
原型/スライド/動画/図解
40種の純CSSスタイル
5軸レビュー+MP4書き出し
デザイン
🎨
Claude無料
AIが生成する平凡なUIを改善する、移植可能なAgent Skills(Claudeスキルマーケット風にインストール)。Claude Code・Codex・Cursorなどのエージェントにレイアウト・タイポグラフィ・モーション・余白の美意識を与え、参考画像やブランドキットを作る画像生成スキルも同梱。
AI生成UIの平凡さを改善
フロント設計スキル12種+
参考画像・ブランドキット生成
Claude/Codex/Cursor対応
デザイン
🎨
Claude無料
claude.ai/design の裏側にある Claude Design 設計エンジンを、ポータブルな Agent Skill として同梱。Claude Code / Cursor / Codex に導入すれば、サイトへのアップロードやサブスク不要で、洗練された UI モック・インタラクティブ試作・ワイヤーフレーム・LP・ダッシュボード・スライドをエディタ内で生成でき、成果物はすべて自己完結型 HTML としてリポジトリに残ります。
設計エンジンをローカル実行
自己完結型HTMLを出力
試作・ワイヤー・スライド
プレビューを指して修正
デザイン
🎯
Claude無料
オープンソースの設計メソッドエンジン。Claude Code / Codex / Cursor に「固定の設計判断力」を与えます(特定の見た目の押し付けではありません)。参照から適切な設計文法を選び・導出し、プロジェクトの決定を STYLESEED.md にロック。0–100 の採点ゲート(80 未満は出さない)とレンダー→採点→修正のループで、あの「AI 生成っぽい」見た目を退治します。
固定の判断力を付与
74ルールでAI臭を排除
0–100採点ゲートで検品
決定をファイルに固定
デザイン
🎨
Claude無料
Google Labs 公式の Agent Skills パック。Stitch MCP サーバーと連携し、UI デザインやコンポーネント構築のワークフローを AI に任せられます。オープンな Agent Skills 標準に準拠し、Claude Code・Cursor・Codex など各種コーディングエージェントに導入できます。
Google 公式デザインスキル
UI設計とコンポーネント構築
Agent Skills 標準に準拠
各コーディングagentで利用可
デザイン
📐
community無料NEW
自然言語、コードベース、Terraform/Kubernetes 設定、SQL DDL から編集可能な .drawio 図を生成し、PNG・SVG・PDF・JPG に書き出します。Claude Code、Cursor、Copilot、Codex などに対応します。
11 種類の図プリセット
コードと構成を図解
視覚セルフチェック
複数形式で出力
デザイン
🎞️
community無料NEW
Claude Code や Codex 向けの単一 HTML プレゼン制作ワークフローです。電子雑誌風とスイス国際様式を備え、横送り、画像・カバー、発表者ノート、リハーサル、2 画面の発表者モードに対応します。
2 つの視覚体系
32 種類のレイアウト
発表者モード
単一 HTML 出力
デザイン