Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/BaselAshraf81/holystitch/llms.txt

Use this file to discover all available pages before exploring further.

HolyStitch runs as an MCP (Model Context Protocol) server inside your IDE. Once configured, your AI assistant can call the convert_stitch_to_react tool directly.

​
Prerequisites

Before configuring your IDE, build the server from source: 
git clone https://github.com/BaselAshraf81/holystitch
cd holystitch
npm install
npm run build
Note the full absolute path to the cloned folder — you’ll need it in the config below.

​
Get your Stitch API key

Go to your Stitch project settings and copy your API key. This key is passed to the server via the STITCH_API_KEY environment variable.
STITCH_API_KEY is required when converting by projectId. If you pass screens directly via htmlScreens, the key is not needed.

​
Configure your IDE

Open your Claude Desktop config file:
  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json
Add the holystitch entry inside mcpServers:
claude_desktop_config.json
{
  "mcpServers": {
    "holystitch": {
      "command": "node",
      "args": ["/Users/alice/holystitch/packages/mcp-server/dist/index.js"],
      "env": {
        "STITCH_API_KEY": "your-api-key-here"
      }
    }
  }
}
Replace /Users/alice/holystitch with the actual path where you cloned the repo.Restart Claude Desktop after saving the file.

​
Path format by operating system

The args array must contain an absolute path to the built dist/index.js file. 
"args": ["/Users/alice/holystitch/packages/mcp-server/dist/index.js"]

​
Environment variables

​
env.STITCH_API_KEY
string
Your Google Stitch API key. Required when using projectId to fetch screens from the Stitch API. Not required when passing screens directly via htmlScreens.Obtain this from your Stitch project settings page.

​
Verify the setup

Once your IDE is configured and restarted, ask your AI assistant: 
List available MCP tools
You should see convert_stitch_to_react in the response. To run a conversion: 
Convert my Stitch project 12828868370598194178 into a Next.js app at /Users/alice/projects/my-app
The project ID is in the Stitch URL: https://stitch.withgoogle.com/project/12828868370598194178

Build docs developers (and LLMs) love

Get started for freeTalk to us