Gemini CLI用のStitch拡張機能は、自然言語コマンドを使ってStitch MCP(Model Context Protocol)サーバーとやり取りできるようにします。これにより、AI搭載のUI/UXデザイン・コード生成ツールであるStitch内でデザインプロジェクトや資産の管理がより容易になります。

✨ 特徴

• ** 🎨 プロジェクト一覧:** あなたのStitchプロジェクトの一覧をご覧ください。
• ** 🎨 プロジェクト詳細:** 特定のプロジェクトの詳細情報を入手できます。
• ** 🎨 画面の取得:** 特定のプロジェクト内のすべての画面にアクセスできる。
• ** 🎨 アセットのダウンロード:** 画像やHTMLファイルなどのアセットをダウンロードしてください。
• ** 🎨 テキストから画面を生成する:** テキストプロンプトから新しい画面を生成し、Gemini 3 ProまたはGemini 3 Flash(デフォルト)モデルを使用します。
• ** 🎨 さらなる特集も近日公開予定…**

📋 前提条件

この拡張機能を使用する前に、以下のものをインストールしていることを確認してください:

1. Gemini CLI:

• Gemini CLI(v0.19.0以降)をインストールすること。
• インストール手順についてはGemini CLIドキュメントを参照してください。

2. gcloud CLI:(オプション、ADC認証に推奨)

• gcloud CLIをインストールして初期化してください。
• Stitchで使うGoogle Cloud Projectを必ず用意してください。

🚀 設置

Stitch Extension for Gemini CLI

The Stitch extension for Gemini CLI enables you to interact with the Stitch MCP (Model Context Protocol) server using natural language commands. This makes it easier to manage your design projects and assets within Stitch, the AI-powered UI/UX design and code generation tool.

✨ Features

• 🎨 List Projects: View a list of your Stitch projects.
• 🎨 Project Details: Get detailed information about a specific project.
• 🎨 Retrieve Screens: Access all screens within a given project.
• 🎨 Download Assets: Download assets such as images and HTML files.
• 🎨 Generate Screen From Text: Generate new screens from text prompt, using Gemini 3 Pro or Gemini 3 Flash(default) models.
• 🎨 More features coming soon…

📋 Prerequisites

Before using this extension, ensure you have the following installed:

1. Gemini CLI:

   • Install the Gemini CLI (v0.19.0 or newer).
   • Refer to Gemini CLI Documentation for installation instructions.

2. gcloud CLI: (Optional, recommended for ADC authentication)

   • Install and initialize the gcloud CLI.
   • Ensure you have a Google Cloud Project to use with Stitch.

🚀 Installation

Run the following command in your terminal to install the Stitch extension:

gemini extensions install https://github.com/gemini-cli-extensions/stitch --auto-update

🔐 Configuration & Authentication

To use the Stitch extension, you need to configure authentication. The Stitch MCP server supports two authentication methods:

• API Key Authentication: Simpler to set up. Use an API key generated from Stitch settings, powered by Google Cloud Managed Projects. Ideal for personal use and quick setup.
• Application Default Credentials (ADC): Uses Google Cloud credentials for authentication. Requires your own Google Cloud project with proper IAM permissions, needs multiple manual steps to set up.

Choose one method below based on your needs.

1. Authenticate with Auth API Key

1. Get API Key:

   • Go to Stitch.
   • Click on your profile icon in the top-right corner.
   • Select “Stitch Settings” from the dropdown menu.
   • Go to the “API Keys” section.
   • Click on “Create Key”.
   • Copy the generated API key.

2. Configure Extension: Run the following commands to configure your API key (replace your-api-key-here with your actual API key):

   export API_KEY="your-api-key-here"
   sed "s/YOUR_API_KEY/$API_KEY/g" ~/.gemini/extensions/Stitch/gemini-extension-apikey.json > ~/.gemini/extensions/Stitch/gemini-extension.json
   

2. Authenticate with Application Default Credentials (ADC)

1. Login to gcloud:

   gcloud auth login
   

2. Configure Project and Quota: