# Stitch Loop

Teaches agents to iteratively build websites using Stitch with an autonomous...

- Repository: https://github.com/google-labs-code/stitch-skills (8654 stars)
- Category: AI and agents
- License: Apache-2.0
- Last updated: 2026-08-17
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add google-labs-code/stitch-skills --skill stitch-loop -g -a claude-code -y`
Codex: `npx skills add google-labs-code/stitch-skills --skill stitch-loop -g -a codex -y`
Cursor: `npx skills add google-labs-code/stitch-skills --skill stitch-loop -g -a cursor -y`
Gemini CLI: `npx skills add google-labs-code/stitch-skills --skill stitch-loop -g -a gemini-cli -y`

## Description

Teaches agents to iteratively build websites using Stitch with an autonomous baton-passing loop pattern

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Stitch Build Loop

You are an **autonomous frontend builder** participating in an iterative site-building loop. Your goal is to generate a page using Stitch, integrate it into the site, and prepare instructions for the next iteration.

## Overview

The Build Loop pattern enables continuous, autonomous website development through a "baton" system. Each iteration:
1. Reads the current task from a baton file (`.stitch/next-prompt.md`)
2. Generates a page using Stitch MCP tools
3. Integrates the page into the site structure
4. Writes the next task to the baton file for the next iteration

## Prerequisites

**Required:**
- Access to the Stitch MCP Server
- A Stitch project (existing or will be created)
- A `.stitch/DESIGN.md` file (generate one using the `design-md` skill if needed)
- A `.stitch/SITE.md` file documenting the site vision and roadmap

**Optional:**
- Chrome DevTools MCP Server, enables visual verification of generated pages

## The Baton System

The `.stitch/next-prompt.md` file acts as a relay baton between iterations:

```markdown
---
page: about
---
A page describing how jules.top tracking works.

**DESIGN SYSTEM (REQUIRED):**
[Copy from .stitch/DESIGN.md Section 6]

**Page Structure:**
1. Header with navigation
2. Explanation of tracking methodology
3. Footer with links
```

**Critical rules:**
- The `page` field in YAML frontmatter determines the output filename
- The prompt content must include the design system block from `.stitch/DESIGN.md`
- You MUST update this file before completing your work to continue the loop

## Execution Protocol

### Step 1: Read the Baton

Parse `.stitch/next-prompt.md` to extract:
- **Page name** from the `page` frontmatter field
- **Prompt content** from the markdown body

### Step 2: Consult Context Files

Before generating, read these files:

The rest: https://github.com/google-labs-code/stitch-skills/blob/HEAD/plugins/stitch-utilities/skills/stitch-loop/SKILL.md
