Labsco
MCP SERVER

Google Stitch MCP

by Kargatharaakash

Generate Google Stitch UI screens from your editor and pull back their code, images and design context.

Design Systems & UI Component Libraries
Summary
Design generation on your own Google Cloud project, driven from the editor.

The useful move here is the pairing: read the design context off a screen you already like, then generate the next screen with that context so fonts, colors and layout carry over instead of drifting. Credentials come from gcloud Application Default Credentials, so the only thing that ends up in the client config is the project ID.

What it is

An MCP server for Google Stitch (npm `stitch-mcp`, 1.3.2) that talks to the Stitch API on your behalf using your gcloud Application Default Credentials. From an MCP-compatible editor you can create projects, list screens, generate a new screen from a prompt, and download a screen's frontend code or high-resolution image. It runs on Windows, macOS and Linux, with Cursor, Claude and Antigravity named as clients.

What you get
  • A new screen generated from your prompt, optionally guided by context taken from an existing one — `generate_screen_from_text`
  • "Design DNA" extracted from a screen — fonts, colors and layouts — to keep a new screen consistent with the ones you already have — `extract_design_context`
  • The raw HTML / frontend code of a screen, downloaded into your project — `fetch_screen_code`
  • The high-resolution screenshot of a screen — `fetch_screen_image`
  • Project and screen management from the same session — `create_project`, `list_projects`, `get_project`, `list_screens`, `get_screen`
  • A two-step flow the README recommends for consistency: extract context from an existing screen, then generate the next one using it
Requirements

A Google Cloud project with the Stitch API enabled, and gcloud on your machine. The setup runs `gcloud auth login`, `gcloud config set project YOUR_PROJECT_ID`, `gcloud auth application-default set-quota-project YOUR_PROJECT_ID` and `gcloud beta services mcp enable stitch.googleapis.com`, then `gcloud auth application-default login` to hand the server credentials. In the client config the command is `npx`, running the `stitch-mcp` package, with `GOOGLE_CLOUD_PROJECT` set to your project ID — no key is pasted into the file. The README states the Google Stitch API is free to use.

Setup effort

One command plus a key — npx -y stitch-mcp, then supply credentials