google-stitch

Generate UI design visuals and HTML code from prompts via Google Stitch.

252|52|Updated Mar 22, 2026

Search Tags:#automation #html #ui-design #prompt-generation #google-stitch #design-mockups

Ready to run

npx skills add https://github.com/duotify/GitHubClawToolkit --skill google-stitch-duotify

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: google-stitch
Source: https://github.com/duotify/GitHubClawToolkit/tree/main/templates/codex-gemini-api/.agents/skills/google-stitch
Command: npx skills add https://github.com/duotify/GitHubClawToolkit --skill google-stitch-duotify

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This skill provides a ready-to-use wrapper around the Google Stitch tool to generate UI mockups and matching HTML from a natural-language prompt, accelerating design prototyping and front-end handoff.

Core Features & Use Cases

Single-step prompt-to-design pipeline: design image plus HTML output.
Supports adjustable image aspect ratio and resolution, with optional model selection.
Outputs design.html and the design image to a local folder, and returns structured JSON in stdout for automation.

Quick Start

Provide a design prompt describing your UI and let the skill generate both a design image and the matching HTML.

Frequently Asked Questions about google-stitch

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate UI design mockups and HTML code from a text prompt?▼

To generate UI mockups and HTML from a prompt, you can use a pipeline that wraps the Google Stitch tool to output both a visual design image and a matching design.html file. It processes natural-language descriptions to produce ready-to-use front-end code.

Can I automate UI design generation and get structured JSON for my workflow?▼

Yes, you can automate UI design generation because the tool returns structured JSON in stdout alongside the generated design image and HTML files. This allows seamless integration into automated front-end prototyping and design pipelines.

Do I need a Gemini API key and Node.js to run prompt-to-design generation?▼

Yes, prompt-to-design generation requires a GEMINI_API_KEY or GOOGLE_API_KEY set in your environment, along with Node.js version 20 or higher. These prerequisites ensure the Google Stitch wrapper can authenticate and execute the design pipeline.

What's the best way to create landing pages or dashboards from a design prompt?▼

The best way to create landing pages or dashboards from a design prompt is using a single-step pipeline that generates both the visual mockup and the HTML code. This approach supports adjustable aspect ratios and resolutions for accurate marketing or UI sections.

Does UI mockup generation support custom aspect ratios and model selection?▼

Yes, UI mockup generation supports adjustable image aspect ratios, resolutions, and optional model selection. This allows you to tailor the visual output dimensions to fit specific landing page layouts or dashboard design requirements.