stitch-loop

Automate iterative website page generation using Stitch MCP and baton files.

Updated Apr 17, 2026
One-click install
npx skills add https://github.com/Chris-Maskey/opencode-config --skill stitch-loop-chris-maskey
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: stitch-loop
Source: https://github.com/Chris-Maskey/opencode-config/tree/main/skills/stitch-loop
Command: npx skills add https://github.com/Chris-Maskey/opencode-config --skill stitch-loop-chris-maskey

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Enables continuous, autonomous website construction by removing manual handoffs between design, generation, and site integration steps. It prevents workflow stalls by enforcing a baton file pattern so agents can read tasks, generate pages, and hand off the next task automatically.

Core Features & Use Cases

  • Baton-driven Iteration: Uses a next-prompt.md baton file to sequence autonomous iterations.
  • Stitch MCP Integration: Calls Stitch MCP tools to discover namespaces, create or reuse projects, generate screens, and retrieve HTML and screenshots.
  • Site Integration & Persistence: Moves generated output from a staging queue into site/public, fixes asset paths, updates navigation, and persists stitch.json project IDs.
  • Context-aware Generation: Reads SITE.md and DESIGN.md to avoid duplicate pages and follow the project's visual system and roadmap.
  • Optional Visual Verification: Supports Chrome DevTools MCP for live rendering checks and screenshot comparison.
  • Orchestration-ready: Works with CI/CD, agent chains, or manual/human-in-loop flows.

Quick Start

Have an agent read next-prompt.md, generate the page with Stitch, move the output into site/public, update SITE.md, and write a new next-prompt.md to continue the loop.

Frequently Asked Questions about stitch-loop

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

FAQPage Schema
How do I automate iterative website page generation using an agent loop?

Automating iterative website page generation involves using a baton file pattern where agents read a next-prompt.md, generate screens via Stitch MCP tools, integrate output into site/public, and write the next baton to continue the autonomous loop.

What is a baton file pattern for continuous frontend builds?

A baton file pattern for continuous frontend builds uses a next-prompt.md file to sequence autonomous iterations, preventing workflow stalls by enforcing agents to read tasks, generate pages, and hand off the next task automatically without manual intervention.

Do I need a Stitch MCP Server to autonomously build websites with agents?

Yes, you need a Stitch MCP Server to autonomously build websites. The agent requires it to discover namespaces, create or reuse projects, generate screens, and retrieve HTML and screenshots during the iterative site construction process.

How do I integrate generated HTML and assets into a site directory during autonomous builds?

Integrating generated HTML and assets involves moving output from a staging queue into site/public, fixing asset paths, updating navigation links, and persisting stitch.json project IDs to maintain state across iterations.

Can I use Chrome DevTools MCP to visually verify generated web pages?

Yes, you can use Chrome DevTools MCP for visual verification of generated web pages. It supports live rendering checks and screenshot comparison to validate that the Stitch-generated output matches your design expectations.

What context files do I need for autonomous agent-driven site construction?

Autonomous agent-driven site construction requires SITE.md and DESIGN.md context files. SITE.md tracks existing pages to avoid duplicates and follows the project roadmap, while DESIGN.md defines the visual system for consistent generation across iterations.