Google Stitch

by Google Labs

AI-powered design-to-code tool that turns design specs into production-ready UI components

See https://stitch.withgoogle.com

Features

  • design.md system — define colors, fonts, and themes in a markdown spec file; Stitch locks these across all generated components for visual consistency
  • Redesign from reference — import a live URL or screenshot and Stitch extracts design patterns to build original layouts (not screenshots clone-copy)
  • Stitch Loop (Claude Code integration) — autonomous pipeline from prompt → enhanced prompt → React components via skills: Enhanced Prompt Skill, Stitch Loop Skill, React Component Skill
  • shadcn UI integration — convert bare Stitch components into animated, interactive shadcn components; full registry support
  • MCP server — connects Stitch to external AI coding workflows (Claude Code, other agents)
  • Stitch Skills — extensible skill system for running specific design workflows

Superpowers

Stitch solves the “generic AI design” problem by anchoring all generation to a design.md spec file. This makes AI-generated designs portable and consistent across agents and sessions. Combined with Claude Code’s agentic loop, a single prompt can drive the full pipeline from design system definition through production-ready React components — without manual handoffs. Particularly powerful for teams that want brand-consistent, automatable UI generation at scale.

Pricing

  • Google Labs / Google AI Studio access — available via Gemini/AI Studio (pricing details evolve; check current docs)