Stitch-MCP
Supports loading environment variables from .env files for configuration management, specifically for storing the STITCH_API_KEY required for authentication with Google Stitch services.
Provides tools for interacting with Google Stitch's AI-powered design platform, enabling project management, screen generation/editing, and design system operations through the Stitch API.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Stitch-MCPgenerate a login screen for my mobile app with a modern design"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Stitch-MCP
An MCP (Model Context Protocol) server that exposes Google Stitch capabilities as local tools by forwarding requests to the remote Stitch MCP endpoint.
What this does
This server:
Runs a local MCP tool server (stdio) using
mcp.server.fastmcp.FastMCPForwards tool calls to
https://stitch.googleapis.com/mcpRequires a Stitch API key provided via the
STITCH_API_KEYenvironment variable
Related MCP server: stitch-pro-mcp
Requirements
Python 3.11+
A Stitch API key (
STITCH_API_KEY)
Installation
Create and activate a virtual environment, then install the package:
python -m venv .venv
source .venv/bin/activate
pip install -e .Configuration
The server loads environment variables from a local .env file (via python-dotenv) if present.
Create a .env file:
STITCH_API_KEY=your_api_key_hereRun the server
You can run it via the installed script:
stitch-mcpOr directly:
python server.pyIn your MCP client, register a stdio server that runs stitch-mcp (or python server.py) and ensure STITCH_API_KEY is available in that process environment.
Available tools
Project management:
list_projects(filter: Optional[str] = None)create_project(title: str)get_project(name: str)
Screen management:
list_screens(projectId: str)get_screen(name: str, projectId: str, screenId: str)
AI generation:
generate_screen_from_text(projectId: str, prompt: str, deviceType: str = "MOBILE", modelId: str = "GEMINI_3_FLASH")edit_screens(projectId: str, selectedScreenIds: list[str], prompt: str, deviceType: str = "DEVICE_TYPE_UNSPECIFIED", modelId: str = "GEMINI_3_FLASH")generate_variants(projectId: str, selectedScreenIds: list[str], prompt: str, variantCount: int = 3, creativeRange: str = "EXPLORE", aspects: Optional[list[str]] = None, deviceType: str = "DEVICE_TYPE_UNSPECIFIED", modelId: str = "GEMINI_3_FLASH")
Design systems:
list_design_systems(projectId: Optional[str] = None)create_design_system(...)update_design_system(...)apply_design_system(projectId: str, assetId: str, screen_instance_ids: list[str], screen_source_names: list[str])
Notes and troubleshooting
If you see
STITCH_API_KEY environment variable not set, verify your.env/environment and restart the MCP client process.Some generation operations can take a few minutes. If a request times out, wait and call
get_screenlater (the server returns a timeout message in this case).
Development
agent.py is a small helper script for manually exercising the tools without an MCP client. Update the placeholder IDs and run:
python agent.pyContribution
If you have any suggestions to this Project or about the Script, feel free to inform me. And if you liked, you are free to use it for yourself.(P.S. Star it too!! 😬 )
Your Contributions are much welcomed here!
Fork the project
Compile your work
Call in for a Pull Request
Credits: Samuel Jayasingh
Last Edited on: 16/04/2026
This server cannot be deployed
Maintenance
Related MCP Connectors
MCP server that lets AI assistants use all OneSchema features exposed via the public API.
Nifty's MCP server — exposes tasks, projects, messages, and files as tools for AI agents.
An MCP server that provides an API to LLMs to manage their JumpCloud resources.
MCP server for generating rough-draft project plans from natural-language prompts.
Related MCP Servers
- AlicenseNot gradedqualityDmaintenanceA universal MCP server for Google Stitch that enables AI-powered UI/UX design generation by extracting design context and metadata from existing screens. It allows users to fetch screen code and images to create consistent, styled UI components across multiple projects.391 npm123Apache 2.0
- AlicenseAqualityDmaintenanceAn intelligent MCP server for Google Stitch that generates production-ready UI from text prompts, with auto-orchestration of design systems, WCAG accessibility, responsive breakpoints, and framework conversion (React, Vue, Svelte).176 npm8MIT
- AlicenseBqualityDmaintenanceComprehensive MCP server for Google Stitch with 36 tools covering design-to-code workflows, including screen generation, code extraction, design analysis, and project management.4486 npm5MIT
- FlicenseAqualityDmaintenanceMCP server that gives AI coding agents the ability to design UIs through Google Stitch. It generates production-ready HTML and screenshots from natural language prompts.9-