mcpField
S
stitch-mcp-list-screens

stitch-mcp-list-screens

github.com/gabelulDesign & UI4738 installsUpdated 14w ago
Repository

About stitch-mcp-list-screens

A skill for listing screens in a Stitch project, intended for workflows that need to locate a screen ID before inspecting it. It requires explicit user mention of Stitch.

Key features

  1. 01List screens in a project
  2. 02Locate a screen ID for get_screen
  3. 03Use the required projects/ID format
  4. 04Review existing screens before generation

Use cases

  1. 01Find the ID of a newly generated screen
  2. 02Browse screens in a Stitch project
  3. 03Check existing screens before creating another

MCP support

Calls the Stitch MCP list_screens tool with a project ID in projects/ID format.

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/gabelul/stitch-kit --skill stitch-mcp-list-screens

After installing, type/stitch-mcp-list-screensin Claude Code to confirm it loaded.

Details

From the project README

Stitch MCP — List Screens

Lists all screens contained within a specific Stitch project. You typically call this right after generate_screen_from_text to find the screenId of the screen that was just created.

Critical prerequisite

Only use this skill when the user explicitly mentions "Stitch".

When to use

  • Immediately after generate_screen_from_text — to find the new screen's ID
  • User wants to browse all screens in a project
  • You need a screenId to call get_screen
  • Checking what screens already exist before generating a new one

Call the MCP tool

Important: Use the projects/ID format — not the numeric ID alone.

{
  "name": "list_screens",
  "arguments": {
    "projectId": "projects/3780309359108792857"
  }
}

✅ "projects/3780309359108792857"
❌ "3780309359108792857"

Output schema

{
  "screens": [
    {
      "name": "projects/3780309359108792857/screens/88805abc123def456",
      "title": "Login Screen",
      "screenshot": {
        "downloadUrl": "https://storage.googleapis.com/..."
      },
      "deviceType": "MOBILE"
    }
  ]
}

After listing

  1. Identify the target screen (usually the most recently generated — last in the list)
  2. Extract the numeric screenId from the name field:
    • "projects/3780309359108792857/screens/88805abc123def456" → screenId = "88805abc123def456"
  3. Call stitch-mcp-get-screen with the numeric projectId and screenId

ID format reminder

For the next call (get_screen), you need the numeric IDs for both project and screen:

  • projectId → 3780309359108792857 (strip projects/ prefix)
  • screenId → 88805abc123def456 (strip projects/.../screens/ prefix)

Comments

Markdown supported