Bolt: Google Stitch Integration
BoltBolt introduced a one-click integration with Google's AI design tool Stitch, allowing users to export full design context — including layouts, components, design tokens, and intent — directly into Bolt with a single click. The integration is timed with Google I/O 2026, where Stitch launched major new capabilities including a real-time streaming design agent and multiplayer editing. Bolt also supports DESIGN.md, an open-source markdown format that encodes a project's entire visual language in a file AI coding agents can read and apply during development. Together, Stitch and Bolt form a continuous pipeline from AI-generated design to deployed full-stack application.
Featured Video
A video we selected to help illustrate this changelog
Key Takeaways
- One-click export from Stitch to Bolt transfers the full design context — page screenshots, HTML, component structure, and a pre-built prompt — with no manual re-description required.
- DESIGN.md is an open-source design token format announced at Google I/O 2026, encoding colors, typography, spacing, and component patterns in a markdown file that AI coding agents can read and apply consistently.
- Stitch and Bolt form a complementary pipeline: Stitch generates and refines visual designs, while Bolt handles databases, authentication, APIs, and deployment.
- MCP support in Stitch enables continuous sync, allowing coding agents to re-import updated screens and keep the codebase aligned with design changes over time — not just a one-time handoff.
- DESIGN.md is tool-agnostic, working with Claude Code, Cursor, and GitHub Copilot in addition to Bolt, making it a potential industry standard for AI-assisted design fidelity.
- Real-time streaming design generation in Stitch lets users steer mid-render, reducing iteration cycles before the design even reaches Bolt.
Sources & Mentions
3 external resources covering this update
The Design-to-Code Gap Just Closed
For years, moving from a designed mockup to a working application required tedious manual handoff: exporting assets, re-describing layouts, and translating visual intent into code by hand. Bolt's new integration with Google Stitch eliminates this friction by letting designers and builders export an entire Stitch design into Bolt in a single click.
One-Click Export to Bolt
Stitch is Google's AI-powered design tool that generates polished app mockups from prompts, voice input, or hand-drawn sketches. When a design is ready, users can click "Export" in Stitch, choose Bolt as the destination, and land directly in Bolt with the full design context pre-loaded — page screenshots, page HTML, component structure, and a populated build prompt. There is no need to re-describe the design. Bolt picks up immediately where Stitch left off.
The workflow is intentionally specialized: Stitch handles design thinking — generating screens, exploring visual variations, refining the aesthetic — while Bolt handles everything that follows: building out databases, authentication, APIs, and deployment logic. As Bolt's blog put it, "The space between 'designed' and 'shipped' just got smaller."
DESIGN.md: A Shared Visual Language for AI Agents
At Google I/O 2026, Google introduced DESIGN.md, an open-source markdown file format that encodes a project's complete design system — colors, typography, spacing rules, and component patterns — in a format AI coding agents can read and apply consistently. Users can download a DESIGN.md from their Stitch project and attach it to Bolt, instructing Bolt to reference the design system file whenever it builds new parts of the app. This ensures that every generated screen and component inherits the same visual rules as the original design, without any manual intervention.
DESIGN.md is designed to be tool-agnostic and is also compatible with Claude Code, Cursor, and GitHub Copilot.
MCP Integration for Continuous Sync
The integration extends beyond a one-time export. Stitch now includes Model Context Protocol (MCP) support, enabling coding agents to import screens from Stitch and synchronize visual changes back into the codebase over time. This creates a living connection between the design source and the running application, rather than a one-way handoff.
Real-Time Design Generation
Also announced at I/O 2026, Stitch's design agent now streams results directly to the canvas as the user types or speaks, allowing mid-generation steering before the design is complete. Individual components can be edited in place without regenerating the entire screen. These improvements reduce iteration time and make the Stitch-to-Bolt pipeline even more continuous.
A Specialized AI Toolchain
This integration reflects a broader shift in how AI-assisted development is structured. Rather than trying to do everything in one tool, Stitch and Bolt each focus on what they do best. Stitch accelerates the design phase with voice input, visual exploration, and real-time rendering. Bolt accelerates the build phase with natural-language prompting, built-in database management, and instant deployment. The result is a specialized toolchain that compresses the full cycle from idea to shipped product.