Generates a high-fidelity UI screen or wireframe from a text prompt using Stitch. This is the core text-to-UI generation tool — the heart of the Stitch workflow.
Generates a UI design screen from a structured text prompt. This is the central action in any Stitch workflow — everything before it (spec generation, prompt assembly) is preparation, and everything after it (screen retrieval, code conversion) is follow-through.
Only use this skill when the user explicitly mentions "Stitch" or when called from an upstream skill (e.g. stitch-ideate, stitch-orchestrator).
You must have a projectId before calling this. If you don't have one:
stitch-mcp-create-projectstitch-mcp-list-projectsstitch-ui-prompt-architect{
"name": "generate_screen_from_text",
"arguments": {
"projectId": "3780309359108792857",
"prompt": "[Full structured prompt — see below]",
"deviceType": "MOBILE",
"modelId": "GEMINI_3_PRO"
}
}
projectId — numeric ID only, no projects/ prefix✅ "3780309359108792857"
❌ "projects/3780309359108792857"
prompt — use the [Context] [Layout] [Components] structure[Context & Style]
[Device] [Mode] [screen type] for [product]. [aesthetic]. [theme]. [colors]. [font].
[Layout]
[Describe the structural arrangement]
[Components]
[Specific named UI components with details]
For best results, use the stitch-ui-prompt-architect skill to assemble the prompt before calling this tool.
deviceType| Value | Use when |
|---|---|
MOBILE | Mobile app, phone-sized UI (default if uncertain) |
DESKTOP | Web dashboard, landing page, SaaS UI |
TABLET | Tablet-specific layout |
AGNOSTIC | Not tied to a specific device — responsive/fluid layout |
modelId| Value | Use when |
|---|---|
GEMINI_3_PRO | Recommended — high-fidelity, complex layouts, production quality |
GEMINI_3_FLASH | Wireframes, rapid iteration, when speed matters more than quality |
This tool returns session info but not the actual screenshot/HTML. To retrieve the design:
stitch-mcp-list-screens with projects/[projectId] to find the new screenstitch-mcp-get-screen with the projectId and screenId to get the screenshot and HTMLBefore calling this tool, verify the prompt:
deviceType parameterWhen the prompt is a complete PRD document (product overview, design system, multiple screen specifications, build guide), Stitch will generate multiple screens in a single call — not just one. Stitch generates up to 10 screens per call. A PRD with 8 screen specs typically produces 5-7 screens automatically.
This is the same mechanism Stitch's web Ideate uses for "generate all screens". The PRD format acts as a comprehensive prompt that Stitch decomposes internally.
How to use batch generation:
Send the full PRD text as the prompt parameter
Stitch generates up to ~10 screens per call from a multi-screen PRD
Two possible outcomes depending on whether the MCP response times out:
If response returns with data:
output_components for continuation suggestions (e.g. "Yes, make them all", "Generate remaining screens")generate_screen_from_text again with the suggestion text as the prompt — the user already initiated generation, no need to re-confirmoutput_components suggestions appear (max 3 continuation calls to prevent infinite loops)If response returns empty (HTTP timeout):
list_screens to discover what was generatedStitch generation takes 60–180 seconds for single screens and up to 5 minutes for multi-screen PRD generation. This is normal behavior, not a timeout.
list_screens afterwardlist_screens, retry ONCE max if nothing appearedexamples/desktop.md — Desktop dashboard prompts (SaaS analytics, admin panel)examples/mobile.md — Mobile app prompts (login, social feed, e-commerce)