Where are the generated images saved?

Images are automatically fetched at full resolution and saved to the design-intent/google-stitch/{feature}/exports/ folder.

Can this skill export React or HTML code?

Yes, the skill can optionally call the fetch_screen_code tool to save generated code directly into your project's code directory.

How do I format my prompt files for this skill?

Use markdown files with '---' separators and HTML comments such as or to define distinct generation sections.

What is required to use the Stitch Screen Generator?

You need the Stitch MCP server (@_davideast/stitch-mcp) configured in your Claude Code environment to allow the agent to communicate with the Stitch API.

What happens if a screen fails to generate?

The skill includes robust error handling that reports specific failures while continuing to process the remaining prompts in your file.

Stitch Screen Generator

Name: Stitch Screen Generator
Author: joaquimscosta

byjoaquimscosta

•

デザインツール

Automates the generation of UI screens and components in Google Stitch directly from structured markdown prompt files.

This skill enables Claude Code to interface with Google Stitch via MCP tools to transform design prompts into visual screens. It handles the entire lifecycle of UI prototyping—from parsing structured prompt files and creating projects to fetching high-resolution images, design DNA, and optional source code. By automating the hand-off between text-based design intent and visual assets, it allows developers to maintain a single source of truth in markdown while generating professional-grade UI mockups and code exports autonomously.

主な機能

016 GitHub stars

02High-resolution image fetching and automated export organization

03Design DNA and context extraction for consistent styling

04Direct integration with Stitch MCP for project management

05Optional source code extraction for generated UI components

06Automated multi-screen generation from parsed markdown sections

ユースケース

01Rapidly prototyping complex web application dashboards from text descriptions

02Batch generating design system components from modular prompt files

03Transforming written design intent into visual mockups for client reviews

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add joaquimscosta/arkhe-claude-plugins generating-stitch-screens

For use in Claude.ai and ChatGPT

主な機能

016 GitHub stars

02High-resolution image fetching and automated export organization

03Design DNA and context extraction for consistent styling

04Direct integration with Stitch MCP for project management

05Optional source code extraction for generated UI components

06Automated multi-screen generation from parsed markdown sections

ユースケース

01Rapidly prototyping complex web application dashboards from text descriptions

02Batch generating design system components from modular prompt files

03Transforming written design intent into visual mockups for client reviews

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add joaquimscosta/arkhe-claude-plugins generating-stitch-screens

For use in Claude.ai and ChatGPT