stitch-mcp-list-design-systems

Stitch MCP — デザインシステムの一覧表示

利用可能なすべての Stitch デザインシステムを一覧表示します。これらは、プロジェクト全体で視覚的な一貫性を保つために画面に適用できる、再利用可能なテーマ設定（色、フォント、角の丸み）です。

重要な前提条件

ユーザーが「Stitch」に明示的に言及した場合にのみ、このスキルを使用してください。

使用するタイミング

• デザインシステムを適用する前に、assetId を確認する必要がある場合
• ユーザーから「利用できるデザインシステムは何ですか？」と尋ねられた場合
• オーケストレーターがプロジェクトのセットアップ中に既存のデザインシステムを確認する場合（ステップ 4b）
• 新しいデザインシステムを作成する前に、既存のものがないか確認する場合

MCP ツールを呼び出す

{
  "name": "list_design_systems",
  "arguments": {
    "projectId": "3780309359108792857"
  }
}

projectId — 数値 ID のみ。省略可能

✅ "3780309359108792857"
❌ "projects/3780309359108792857"

省略すると、すべてのプロジェクトのデザインシステムを返します。

出力スキーマ

Asset オブジェクトの配列を返します。

{
  "assets": [
    {
      "name": "assets/15996705518239280238",
      "displayName": "SaaS Dashboard Theme",
      "designSystem": {
        "theme": {
          "colorMode": "LIGHT",
          "font": "DM_SANS",
          "roundness": "ROUND_EIGHT",
          "customColor": "#6366F1",
          "backgroundLight": "#FFFFFF",
          "backgroundDark": "#18181B"
        }
      }
    }
  ]
}

一覧表示後

読みやすい表として提示します。

#	名前	フォント	色	モード	Asset ID
1	SaaS Dashboard Theme	DM Sans	#6366F1	ライト	15996705518239280238

次に、以下を提案します。

• 「これらのいずれかを画面に適用しますか？」 → stitch-mcp-apply-design-system
• 「既存のデザインシステムを更新しますか？」 → stitch-mcp-update-design-system
• 「新しいデザインシステムを作成しますか？」 → stitch-mcp-create-design-system

各アセットから name フィールド（assets/15996...）を取り出します。次の呼び出しに応じて、2 通りの方法で使用します。

• apply_design_system の assetId — assets/ プレフィックスを取り除き、数値 ID のみを渡します
• update_design_system の designSystem.name — プレフィックスを含め、返されたとおりの name を渡します