Skip to content
  • Home

  • Productivity

  • App tips

App tips

8 min read

What is Google Stitch?

By Miguel Rebelo · May 5, 2026
A hero image with the Google Stitch logo

You're building an amazing product running on ground-breaking technology. Explaining it to investors, users, or your co-founder gets them eager to see more. But even if people understand the value of your idea in theory, seeing an interface that looks like a wireframe drawn on a dirty napkin is the easiest way to kill that initial excitement.

Google Stitch helps you remove the friction in the first contact with an idea, raising the bar of your starter design without you spending two hours on Figma adjusting rectangles. Describe it in plain language, get a high-fidelity mockup, and then iterate or export when you're ready to prepare it for real usage.

Table of contents:

  • What is Google Stitch?

  • What does Stitch actually do?

  • Who is Google Stitch for?

  • How to get started with Google Stitch

  • Stitching a product together

What is Google Stitch?

The Google Stitch landing page

Google Stitch is a free, AI-powered UI design tool from Google Labs. You describe a screen in plain language, and Stitch generates a high-fidelity mockup in under five minutes. You can iterate on it with natural language, export it in a range of formats, or push it directly to Figma. It runs entirely in the browser and requires no design experience.

Stitch used to be Galileo AI, one of the first early AI design tools to hit the market. Google acquired it in 2025 and kept building it up to become an "AI-native software design canvas," launching it at Google I/O that same year. It's currently powered by Gemini models, including Nano Banana for remixing screens.

It's currently free—at least while in beta. You get 400 credits per day. Starting a new project (generating a base design system and five screens) costs around 9 credits, with each edit costing between 2 and 5 credits, in my testing experience.

What does Stitch actually do?

Text-to-UI generation and edits

A mockup for a Zapier-themed time tracking mobile app.

Describe a screen in plain language with as much detail as you can, for example: "A fitness app home screen showing today's workout plan, a progress ring, and a shortcut to the exercise library. Dark mode, clean, minimal." Wait between two and five minutes as Stitch generates a design system and then starts working on the screens, placing them on the canvas side by side.

In the past, it would only give you one screen at a time; it now generates up to five starter screens, and you can ask for more later. This was one of the big changes that put Stitch on the map in 2026, making it faster and more intuitive to use than before.

As any AI tool worth its salt, it generates more than a generic template: it reasons through your request, building dashboards, profile pages, or social feeds based on design best practices that we see everywhere. This cuts both ways: it's great for a starter design that's clean and functional—but if you want something fresh and creative, you'll need to get into prompt engineering or build it yourself.

Once all the initial screens are done, you can ask for more using the prompt input at the bottom of the screen. Click any screen to expose editing tools (right-clicking exposes even more; be sure to check it out), which include annotations and local prompt windows to use AI to change selected elements.

At any point, you can turn Live Mode on—currently in preview—to chat with AI to brainstorm ideas and ask for design changes in real time. Speak out your instructions: the AI queues them, starts executing, and updates the design. This is great if you like to sit back to brainstorm, or maybe for sharing with design clients who tell you to "make it pop, please."

Build with a design system

A design system in Google Stitch

Under the hood, Stitch always generates a DESIGN.md file. This acts as your single source of truth for everything about your project, including colors, typography, and the look and feel of every screen. The AI model uses this file as context when generating new elements, maintaining consistency throughout.

This is very similar to how AGENTS.md works for coding agents. It starts with a list of color hexes, followed by typography, sizing, and spacing rules. Then comes a natural language description of branding, layouts, and component guidelines that you can read or edit to change how the AI model processes your requests.

DESIGN.md isn't locked inside Stitch: Google decided to open-source this standard so you can reuse it in other Stitch projects, or by passing it to any other AI prototyping or coding tool.

Preview with Instant Prototype

Instant Prototype in Google Stitch

The play button at the top right of the screen creates an Instant Prototype. True to its name, it opens a dedicated interactive view where you can navigate between screens, simulating the actual user flow. One caveat: only links that connect to generated screens are active—you can't click through to screens that don't exist yet. Within the prototype view, there's an Edit tab that lets you select any element, write a prompt, and have AI update it directly.

Export options

Once you finish your design, you want to push it out to refine or move to the build stage. If you don't see export options when you click the button, remember that you need to select all the screens that you want to export: that's what will expose the controls.

Developers will be using:

  • HTML and Tailwind CSS. The core code export. While clean and structured, it's only a scaffold: you'll still have to consider accessibility and replace all the hard-coded values.

  • React app exports a working React application. Even though the result is placed on the Stitch canvas, the preview doesn't work too well: right-click the element and preview it in a separate browser tab.

  • MCP exposes the project as an MCP resource so you can use AI tools to interact with it.

  • ZIP file downloads everything as a .zip.

  • Code to clipboard copies the HTML/CSS directly so you can paste it anywhere.

For handoff and collaboration:

  • The Figma option places a copy of your selected screens on the clipboard, so you can directly paste them onto your project. Every element lands ready to work on: Auto Layout structure, named layers, logically grouped components, and editable text. 

  • The Instant Prototype can be shared with others, so you can get buy-in or early feedback before moving to a more serious building stage.

  • Project brief generates a plain-text summary of the core project objectives, look, and feel. This is useful for alignment before handing off to engineering or to take as a prompt into other AI tools.

For actually building the entire app:

  • Jules exports to Google's autonomous AI coding agent, using the Stitch project as a reference.

  • AI Studio sets up your selected screens as a reference prompt in Google's AI Studio, a vibe-coding platform.

Where Google Stitch falls short for now

The first snag you'll notice is that the model sometimes fails to follow a part of your instructions, showing a lack of flexibility when interpreting your intent. Switching to the smarter model improves accuracy, but I still found imprecisions as I kept prompting.

The generated design is a great starting point for prototyping or sharing your vision with others without committing a lot of early work, but the road to production is still long from what Stitch offers. You'll still need to do:

  • The product management work to scope and prioritize features, defining how they work holistically in the frontend and backend. For example, if your app has real-time weather updates, how are they delivered? How do these tie with the rest of the app's capabilities? What systems do you need to deliver these reliably?

  • The UI/UX work of handling edge cases. Stitch now offers a Missing States feature to generate empty states for screens—a nice touch, but not enough to polish all the rough edges.

  • The accessibility work: Generated designs may fail contrast ratios or touch size checks, for example.

  • The frontend engineering work to tie the interface to the backend, turn the hard-coded values dynamic, and make sure that everything works to spec.

This means that Google Stitch doesn't "kill" designers or Figma, instead acting as a tool in the workflow that increases ideation speed and raises the floor of what people without design experience can build.

Who is Google Stitch for?

So, if Stitch doesn't kill designers or Figma, who will benefit the most from using it?

I'd say it's best for builders and developers who don't want to or can't design. If you spend a lot of time working on the visuals of an app or website but can't get smooth results, Stitch makes it look good without as much effort.

Designers in early-stage ideation can quickly spin up a first draft and explore possibilities before locking in on the solution. Stitch can be useful as scaffolding that you later customize in Figma with more creative visuals, interactive elements, and an original user experience.

Product managers and founders can use it to validate ideas. Unlike with vibe coding or prototyping tools that already build some of the backend, Stitch focuses solely on what the product looks like. This reduces the total generation time, and you don't have to worry about code bugs messing up your preview, making it faster to have something to show to your team or investors.

How to get started with Google Stitch

Google Stitch is free to use for now. Head to the website at stitch.withgoogle.com, sign up with your Google account, and start turning your 400 daily credits into cool designs. Here are a few tips to get you up to speed faster.

General advice. Remember to start from a prompt as detailed as possible. As you navigate the canvas, look to the right side to see the navigation and editing controls, and to the top for the contextual action menu. On the left side, you'll see the agent log and reasoning trace, so you can keep an eye on what the AI is building and your project history.

Model selection. Stitch has Gemini 3 Flash selected by default, the fastest but lower-quality option. Gemini 3.1 interprets your prompts a little better, and the overall design quality follows suit—and I didn't notice the slower generation speed at all. If you want a bolder, more creative look, start by designing with a Gemini model and then use the Redesign feature with Nano Banana (accessible in the model selector).

Exporting. You can't export anything without selecting. Use Ctrl + A (or command + A on a Mac) to select everything, or drag in the canvas to select multiple elements at the same time.

Design systems. When you start from a website reference and want to access the DESIGN.md file, you'll notice it isn't there. Easy fix: prompt Stitch with "generate the design system for this brand and place it on the canvas." You'll be able to change the colors in the visual interface right away and edit the instructions in the DESIGN.md tab.

Stitching a product together

Google Stitch is a good speed boost to bring that idea trapped in your head onto the screen. It's especially good for overthinkers who spend too much time adjusting padding and still feel that there isn't enough white space (yes, I'm talking about myself). It improves the first attempt at building an app for people who don't know what design is.

While these are all valid pros, Stitch also introduces new puzzles: when AI-driven design becomes the norm, it'll be easy to see which products were curated with taste and which were mindlessly copy/pasted onto production. The meaning of good design will take another step away from executing project briefs, moving one step further toward real originality and creativity.

Related reading:

  • How to automate Gemini (Google AI Studio)

  • How to get a Google Gemini API key

  • Post Gemini images to Slack from form submissions

Get productivity tips delivered straight to your inbox

We’ll email you 1-3 times per week—and never share your information.

tags
mentioned apps

Related articles

Improve your productivity automatically. Use Zapier to get your apps working together.

Sign up
See how Zapier works
A Zap with the trigger 'When I get a new lead from Facebook,' and the action 'Notify my team in Slack'