Does Stitch respect my existing project's design language?

Absolutely. Stitch reads local design documentation and user profiles to ensure that new screens match your established typography, color schemes, and component patterns.

What is the primary function of the Stitch skill?

Stitch is designed to automate the creation and modification of UI screens using the Google Stitch SDK, allowing developers to generate visual mockups directly from their CLI.

Can I use different AI models for design generation?

Yes, Stitch supports the --model flag, allowing you to choose between 'pro' (Gemini 1.5 Pro) for complex reasoning or 'flash' (Gemini 1.5 Flash) for faster iterations.

What does the --reimagine flag do?

The --reimagine flag allows the AI to completely rethink the layout and UX of an existing screen ID, providing a fresh perspective while keeping the original intent.

How do I view the designs generated by Stitch?

For security and consistency, designs are not rendered locally. Instead, the skill provides a specific dashboard URL where you can view and manage your generated screens.

Stitch UI Designer

Name: Stitch UI Designer
Author: myrtlepn

bymyrtlepn

•

デザインツール

Generates and iterates on high-fidelity UI designs using the Google Stitch SDK directly within the Claude Code environment.

Stitch is a sophisticated UI design skill for Claude Code that leverages the Google Stitch SDK to create, edit, and reimagine frontend screens. It streamlines the design-to-code workflow by allowing developers to generate mockups, variants, and complete design systems based on natural language prompts. The skill intelligently integrates with existing project contexts, follows established design systems via local documentation, and provides a centralized dashboard for viewing results. Whether you are prototyping a new feature or performing a full-scale UI redesign, Stitch automates the visual layout process while maintaining consistency across your application.

主な機能

01Automated UI screen generation from natural language descriptions

02Context-aware editing and 'reimagining' of existing UI components

03Dynamic variant generation to explore multiple design directions simultaneously

0420 GitHub stars

05Support for Gemini Pro and Flash models to balance design quality and speed

06Integration with project-specific design systems and user profile preferences

ユースケース

01Refactoring existing layouts to align with an updated design system or branding

02Rapidly prototyping new application pages and routing structures

03Generating multiple high-fidelity design variants for A/B testing or stakeholder review

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add myrtlepn/gran-maestro stitch

For use in Claude.ai and ChatGPT