Google Stitch MCP server for AI agents and assistants

Securely connect your AI agents and chatbots (Claude, ChatGPT, Cursor, etc) with Google Stitch MCP or direct API to manage projects, create screens, inspect artifacts, and update design systems through natural language.

Google Stitch logoGoogle Stitch
Api Key

Google Stitch is an AI interface-design service for creating and managing digital product designs. It provides structured tools for projects, screens, artifacts, and design systems.

16 Tools

Try Google Stitch now

Type what you want done — sign in and watch it run live in the Tool Router playground.

TOOL ROUTER PLAYGROUND
Google Stitch
Try asking
TOOLS

Supported Tools

Every Google Stitch action and event your agent gets out of the box.

Apply Design System

Apply one design system to 1-20 unique typed screen instances from Get Project.

Create Design System

Create a typed Stitch design system from explicit current theme fields.

Create Design System From Markdown

Create a project design system from the exact screen instance returned by Upload Design Markdown.

Create Project

Create a Stitch project container for UI designs and return its project resource name.

Delete Project

Permanently delete one Google Stitch project.

Download Screen File

Retrieve bounded HTML or screenshot content using a provider-owned Stitch file resource name.

Edit Screens

Apply one text-directed edit to up to 20 existing Stitch screens and return every changed screen or clarification question.

Generate Screen

Generate screens from a bounded text prompt in an existing Stitch project.

Generate Screen Variants

Generate 1-5 variants for up to 20 unique source screens with exact creative-range, aspect, device, and model enums.

Get Project

Get one Stitch project by full resource name, including screen instances needed for design-system application.

Get Screen

Get one Stitch screen by full resource name and return bounded screen metadata plus provider-owned HTML and screenshot file references.

List Design Systems

List complete Google Stitch design systems for one project.

List Projects

List complete Google Stitch projects owned by the connected account or explicitly shared with it.

List Screens

List all screens currently returned for one Stitch project, including safe HTML and screenshot file resource references.

Update Design System

Replace a Stitch design system's display name and typed nondeprecated theme for one project.

Upload Design Markdown

Upload bounded UTF-8 DESIGN.

SETUP GUIDE

Connect Google Stitch MCP Tool with your Agent

1

Install Composio

typescript
npm install @composio/core ai @ai-sdk/mcp @ai-sdk/openai
Install the Composio SDK and your agent framework
2

Create a session with MCP enabled

typescript
import { Composio } from "@composio/core";

const composio = new Composio();
const { mcp } = await composio.create("your-user-id", {
  toolkits: ["google_stitch"],
  mcp: true,
});
Create a session scoped to Google Stitch and read its MCP URL and headers
3

Connect your agent to the MCP server

typescript
import { createMCPClient } from "@ai-sdk/mcp";
import { openai } from "@ai-sdk/openai";
import { generateText, stepCountIs } from "ai";

const client = await createMCPClient({
  transport: { type: "http", url: mcp.url, headers: mcp.headers },
});

const { text } = await generateText({
  model: openai("gpt-5.6-sol"),
  tools: await client.tools(),
  prompt: "List all my Google Stitch projects",
  stopWhen: stepCountIs(10),
});

console.log(text);
await client.close();
Pass the session's MCP URL and headers to your agent and run a Google Stitch request
SETUP GUIDE

Connect Google Stitch API Tool with your Agent

1

Install Composio

typescript
npm install @composio/core @composio/openai openai
Install the Composio SDK, the OpenAI provider, and the OpenAI SDK
2

Create a Composio session

typescript
import OpenAI from "openai";
import { Composio } from "@composio/core";
import { OpenAIResponsesProvider } from "@composio/openai";

const composio = new Composio({ provider: new OpenAIResponsesProvider() });
const client = new OpenAI();

const session = await composio.create("your-user-id", { toolkits: ["google_stitch"] });
const tools = await session.tools();
Initialize Composio with the OpenAI Responses provider and create a session scoped to Google Stitch
3

Run Google Stitch tools with your agent

typescript
let response = await client.responses.create({
  model: "gpt-5.6-sol",
  tools,
  input: [{ role: "user", content: "List all my Google Stitch projects" }],
});

while (response.output.some((o) => o.type === "function_call")) {
  const outputs = await composio.provider.handleToolCalls(session, response.output);
  response = await client.responses.create({
    model: "gpt-5.6-sol",
    tools,
    previous_response_id: response.id,
    input: outputs,
  });
}

console.log(response.output_text);
Send a request, execute the Google Stitch tool calls through the session, and print the final answer

Why Use Composio?

AI Native Google Stitch Integration

  • Supports both Google Stitch MCP and direct API based integrations
  • Structured, LLM-friendly schemas for reliable project, screen, artifact, and design system actions
  • Rich coverage for reading, creating, and updating your Google Stitch design data

Managed Auth

  • Secure API key handling without hard-coded credentials in your agent code
  • Central place to manage, scope, and revoke Google Stitch access
  • Per user and per environment credentials for safer development and production deployments

Agent Optimized Design

  • Tools are tuned using real error and success rates to improve reliability over time
  • Comprehensive execution logs so you always know what ran, when, and on whose behalf

Enterprise Grade Security

  • Fine-grained RBAC so you control which agents and users can access Google Stitch
  • Scoped, least privilege access to Google Stitch resources
  • Full audit trail of agent actions to support review and compliance

Rolling this out across your team?

Give your team centralized access control across every framework with Composio’s MCP Gateway.

EXPLORE MCP GATEWAY
FAQ

Frequently asked questions

Yes, Google Stitch requires you to configure your own API key credentials. Once set up, Composio handles secure credential storage and API request handling for you.

Yes! Composio's Tool Router enables agents to use multiple toolkits. Learn more.

Yes. Composio is SOC 2 Type II compliant and is built to keep your Google Stitch connection and credentials secure. OAuth tokens and API keys are encrypted, and sensitive customer data is protected at rest and in transit.

Composio also undergoes independent security testing and continuously monitors its systems for security threats. You can review the latest reports and policies in the Composio Trust Center.

Composio maintains and updates all toolkit integrations automatically, so your agents always work with the latest API versions.

Create the key in your Google Stitch account settings, then paste it once on Composio's connection page. Composio stores it encrypted and uses it only for the Google Stitch actions your agent runs. Nobody else in your workspace can read it, and you can revoke it inside Google Stitch at any time.

When you connect a Google Stitch account through Composio, every action runs under that account, so anything the agent creates, sends, or changes shows up in Google Stitch as done by you. Keep an approval step in your prompt for actions with side effects, such as sending or deleting, and have the agent draft first.

Whatever the credentials you connect allow inside Google Stitch. If Google Stitch lets you scope a key to specific permissions, create a scoped one so the agent can only do what you intend. You can revoke the key inside Google Stitch at any time.

Yes. Composio supports multiple connected accounts for the same app, and that works in Claude, ChatGPT, or any other assistant you connect through Composio. Give each Google Stitch connection a name such as work or personal, and the assistant uses the one you mention in the request. Each account keeps its own credentials and nothing is merged.

The connection stops working the moment Google Stitch rejects the old key. Create a new key in Google Stitch and reconnect the account from the Composio dashboard or by asking your agent to reconnect Google Stitch. Nothing else changes.

Composio's free Hobby plan includes 100,000 tool calls per month with no credit card, which covers most personal Google Stitch use. Paid plans add higher limits and team features. Your Google Stitch plan and its API limits still apply as usual.

Built-in connectors usually give one AI access to a limited set of apps. Many people use Composio because it lets their AI connect to more apps than it normally supports, or connect to multiple accounts for the same app (e.g. connect Claude to multiple Google Stitch accounts).

With Composio, you connect Google Stitch once and then use it across different AI assistants without setting it up separately in each one. Connect your apps to Composio once, then connect Composio to whichever AI you use, whether that's Claude, ChatGPT, Hermes, or your own custom assistant.

Start with Google Stitch.It takes 30 seconds.

Managed auth, hosted MCP servers, and every Google Stitch tool your agent needs.Free to start.

Start building