Design & Frontend stitch-mcpwebsite-generationfrontend-buildingiterative-developmentbaton-passingchrome-devtools

Stitch Build Loop

Continuously generate, integrate, and advance website pages with Stitch iterations.

FollowSkills review · FSRS-2.0
Not recommended
41/ 100 5-point scale 2.1 / 5
Trust9 / 25 · 1.8/5

The required tools and Stitch MCP dependency are disclosed, and the skill requires user confirmation before refreshing existing designs; however, Bash, Write, and external MCP access are broad, while project creation, downloads, site edits, and baton continuation are autonomous. Least-privilege controls, sensitive-data handling, rollback, and complete data-flow disclosure are incomplete, so points are deducted.

Reliability7 / 20 · 1.8/5

The execution protocol, file structure, metadata schema, troubleshooting table, and baton validation rules are fairly specific; however, key failures such as project creation, download, invalid page names, and permission errors are not handled in depth. There are no skill-specific tests or reproducible execution records, so the static ceiling applies and points are deducted.

Adaptability8 / 15 · 2.7/5

The audience, iterative scenario, input files, and principal outputs are reasonably clear, and optional Chrome verification is described; however, non-fit boundaries, semantic trigger conditions, Chinese support, and mainland-China network reachability are not addressed. Core operation depends on Stitch MCP, so environmental fit remains uncertain.

Convention8 / 15 · 2.7/5

The documentation is layered and includes prerequisites, workflow steps, examples, resource templates, troubleshooting, and limitation notes. The repository supplies an Apache-2.0 license, security policy, and CI, but lacks a clear maintainer, skill version, changelog, or explicit update path. The README's claim of automated validation is also stronger than the available evidence, so points are deducted.

Effectiveness6 / 15 · 2.0/5

The workflow covers reading the task, generating a page, integrating it, updating navigation and documentation, and preparing the next baton; it could complete the core iteration and produce usable HTML. However, generation quality, downloads, link repairs, and visual fidelity are unexecuted and unverified, and autonomous looping adds review cost, so the score remains below the static maximum.

Verifiability3 / 10 · 1.5/5

The source files, examples, and metadata schema are auditable, and the repository has CI; however, the CI validates a different react-components skill, with no stitch-loop tests, real run logs, or independent corroboration. The conclusion is therefore mainly documentation-based and constrained by the static ceiling.

Evidence confidence:Low Reviewed Jul 20, 2026 Reviewed revision ad4b8bc8c519
The upstream repository has new commits since this review. The score still applies to the reviewed revision shown and may not cover the latest changes.
Before you use it
  • Core operation depends on Stitch MCP, project credentials, and potentially overseas services; reachability and authentication should be verified for mainland-China users before adoption.
  • The skill grants Bash, Write, and multiple MCP namespaces; review the actual tool inventory, restrict write locations, and keep recoverable copies before project creation, downloads, or site edits.
  • The autonomous loop requires modifying next-prompt.md before completion and may select or invent the next page; production use should add human approval, budgets, and an explicit termination condition.
  • No skill-specific tests or real execution evidence are provided; validate metadata persistence, download URL handling, relative-path repair, navigation updates, and failure messages before adoption.
See the full review method →

What does this skill do, and when should you use it?

Stitch Build Loop is a frontend-building skill for the Stitch MCP Server that uses a baton file to drive repeated website iterations. Each iteration reads the current task, generates a page with Stitch, integrates it into the site, and prepares the next task. It expects a Stitch project plus `.stitch/DESIGN.md` and `.stitch/SITE.md` files. Chrome DevTools MCP Server can provide optional visual verification.

Reads .stitch/next-prompt.md for the page name and task; reads .stitch/SITE.md and .stitch/DESIGN.md for site planning and visual rules; discovers Stitch MCP tools and creates or retrieves a Stitch project; calls generate_screen_from_text to generate a page for the requested device; persists project and screen metadata in .stitch/metadata.json; downloads HTML and screenshots into .stitch/designs/; moves generated HTML into site/public/, fixes asset paths, and updates navigation; updates .stitch/SITE.md; and writes the next iteration to .stitch/next-prompt.md.

  1. A frontend developer wants to build a multi-page website page by page from an initial Stitch prompt.
  2. A team needs generated pages to follow a shared visual system defined in `.stitch/DESIGN.md`.
  3. A developer wants `.stitch/next-prompt.md` to pass the next web task between human review, CI/CD, or agent-chain iterations.
  4. A team needs to integrate Stitch-generated static HTML into an existing `site/public/` structure.
  5. A developer wants optional Chrome DevTools MCP screenshots to visually check generated pages when that server is available.

What are this skill's strengths and limitations?

Pros
  • Covers task intake, Stitch generation, HTML integration, navigation updates, and next-task preparation.
  • Uses `.stitch/DESIGN.md` and `.stitch/SITE.md` to support visual consistency and roadmap-aware page selection.
  • Persists Stitch project and screen metadata for later iterations.
  • Can optionally use Chrome DevTools MCP for visual verification.
Limitations
  • Requires the Stitch MCP Server, local filesystem access, and shell access.
  • Visual verification is optional and is skipped when Chrome DevTools MCP is unavailable.
  • The source provides no test suite, performance benchmarks, or cross-platform validation results.
  • Each iteration depends on maintaining the expected `.stitch/` file structure and updating the baton file.

How do you install this skill?

Install the repository's plugins/stitch-utilities plugin, or use the README command: npx skills add google-labs-code/stitch-skills. Configure and run the Stitch MCP Server before use. The source does not provide a separate installation command or version requirement for this individual skill.

How do you use this skill?

Prepare a Stitch project, .stitch/DESIGN.md, .stitch/SITE.md, and .stitch/next-prompt.md, then trigger the agent with a prompt such as: Build a 5-page portfolio website with Stitch. The skill follows the baton loop to generate and integrate pages, then updates the next task. If local design files already exist, it asks before refreshing them from Stitch.

FAQ

Is the Stitch MCP Server required?
Yes. The skill lists access to the Stitch MCP Server as required; Chrome DevTools MCP Server is optional.
Does it run an entire website build without human review?
It supports continuous iterative execution, but the source also describes a human-in-the-loop option, so the degree of autonomy depends on the external orchestration setup.
What happens if the local HTML and screenshot already exist?
The skill should ask whether to refresh them from the Stitch project and only re-download them after confirmation.
Does it only generate designs, or does it change site files too?
It moves generated HTML into `site/public/`, fixes asset paths, updates navigation, and modifies `.stitch/SITE.md` and `.stitch/next-prompt.md`.

More skills from this repository

All from google-labs-code/stitch-skills

Design & Frontend

Stitch Design System Synthesizer

Analyze Stitch projects and turn existing UI patterns into a reusable DESIGN.md.

Design & Frontend

Stitch Screen Generator

Generate, edit, and explore Stitch screens from text or images.

Design & Frontend

Stitch Frontend Design Extractor

Turn frontend source code into a Stitch-ready DESIGN.md.

Design & Frontend

Stitch Prompt Refiner

Turns vague UI ideas into structured prompts optimized for better Stitch generation.

Design & Frontend

Stitch Static HTML Extractor

Turn a rendered web page into a self-contained HTML snapshot for sharing or Stitch upload.

Design & Frontend

Stitch React Component Builder

Turn Stitch screens into modular, maintainable, and validated React components.

Dev & Engineering

Stitch Remotion Walkthrough Builder

Turn Stitch app screens into polished walkthrough videos with transitions, zoom effects, and contextual overlays.

Dev & Engineering

Stitch React Dashboard Builder

Turn Stitch screens into production-ready React and Vite dashboards for dense data workflows.

Dev & Engineering

Stitch React Native Builder

Turn Stitch HTML designs into maintainable React Native components and sync existing native screens with design updates.

Design & Frontend

Stitch Code-to-Design

Turn an existing frontend codebase into a Stitch-ready design and design system.

Design & Frontend

Stitch Design System Manager

Create, update, and apply consistent project-level design systems in Stitch.

Design & Frontend

Stitch Asset Uploader

Reliably upload local images, HTML, and design documents to Google Stitch projects.

Design & Frontend

Stitch Design Taste

Generates rigorous, non-generic DESIGN.md systems for premium Google Stitch screen generation.

Design & Frontend

shadcn/ui Component Integration Guide

Guides developers through discovering, installing, customizing, and validating shadcn/ui components.

Related skills