stitch-mcp
A CLI for moving AI-generated UI designs from Google’s Stitch platform into your development workflow.
stitch-mcp is an MCP server and CLI that bridges Google's Stitch AI-generated UI design platform with local development workflows and AI coding agents. It fetches HTML/CSS designs from Stitch's API and exposes them through MCP tools that agents can invoke to retrieve design code, generate sites, and map screens to routes. Developers can preview designs locally on a dev server, build deployable Astro sites from screens, or give their IDE's coding agent direct access to design context with automatic authentication. The proxy mode integrates with VS Code, Cursor, Claude Code, and other MCP-compatible clients.
Key Features
Use Cases
- 01Give Cursor or VS Code AI assistants access to Stitch designs so they can build implementations from generated UI
- 02Preview all screens from a Stitch project locally before integrating into production
- 03Generate a complete Astro static site from AI-designed screens with custom route mappings
- 04Explore Stitch project structure and screen metadata in the terminal before writing prompts
- 05Automate design-to-code handoff by fetching HTML and images programmatically for agent context
- 06Test and debug Stitch MCP tools from the CLI without connecting an AI client
Related MCP Servers
View moremarkitdown
Python tool for converting files and office documents to Markdown.
firecrawl
The context API to search, scrape, and interact with the web at scale. 🔥
prompts.chat
f.k.a. Awesome ChatGPT Prompts. Share, discover, and collect prompts from the community. Free and open source — self-host for your organization with complete privacy.
langflow
Langflow is a powerful tool for building and deploying AI-powered agents and workflows.
stitch-mcp — FAQ
What is stitch-mcp?+
stitch-mcp is an MCP server and CLI tool that connects Google's Stitch AI design platform to local development environments and AI coding agents. It exposes Stitch's design API through MCP tools so agents can fetch HTML, build sites, and access design context.
How do I install stitch-mcp?+
Run npx @_davideast/stitch-mcp init to install dependencies and configure authentication automatically. No global installation is required—you can run all commands directly with npx. For global access, use npm install -g @_davideast/stitch-mcp.
Which AI clients work with stitch-mcp?+
The MCP proxy works with VS Code, Cursor, Claude Code, Gemini CLI, Codex, and OpenCode. Add the proxy command to your MCP client configuration to enable Stitch tools for your coding agent.
Do I need a Google Cloud project or API key?+
Yes, you need a Google Cloud project with billing enabled and the Stitch API enabled. The init wizard handles gcloud setup and OAuth automatically, or you can set STITCH_API_KEY to authenticate with an API key instead.
Is stitch-mcp free to use?+
The tool itself is open source under Apache 2.0 license. However, you'll need a Google Cloud project with billing enabled to access the Stitch API, which may incur usage costs depending on your API consumption.
How do I connect stitch-mcp to my AI coding agent?+
Add a configuration block to your MCP client settings with command npx and args ["@_davideast/stitch-mcp", "proxy"]. The proxy exposes tools like build_site, get_screen_code, and get_screen_image that your agent can invoke to access Stitch designs.
How do I install stitch-mcp?+
Open the source repository on GitHub and follow its README. stitch-mcp is a mcp server — MCP Agents Market links you directly to the official repo.
Is stitch-mcp free?+
stitch-mcp is an open-source project hosted on GitHub. Check the repository for its license and any usage requirements.