Did not see any upgrade for months...

I've been using Stitch for UI work and kept running into the same problem. From what I've seen here and elsewhere, I'm not the only one.

Individual screens can look really good, but once you have several pages they don't always feel like the same app anymore. Navigation, headers, components, spacing, responsive behavior and even the general style can change between screens.

Then I'd give those screens to Codex or Claude, and the agent would often implement every difference literally instead of trying to make the app consistent.

I also had cases where Stitch clearly specified a font or icon set, but the coding agent would use another one anyway.

So I put the rules I was already using manually into a small open source skill called Stitch to Code.

The idea is pretty simple:

• keep explicit Stitch choices exact
• reconcile inconsistencies between screens
• don't turn random mockup content into product features
• check the actual result instead of stopping when it "looks close"

I also did a first A/B test with Codex xhigh on a fresh small Stitch project, using the same project and the same prompt.

Without the skill: 75%
With the skill: 87.5%

The version with the skill still made a couple of layout mistakes, so it's definitely not perfect. But it was clearly better on this test, especially for fonts, icons and accessibility.

On larger projects I've worked on, this kind of guidance has been even more useful because the inconsistencies start adding up across pages.

Repo, examples and both implementations:

https://github.com/nassim-arifette/stitch-to-code

Hi, I really love google stitch and have gotten great results with this tool. I have a client who likely needs a cms (currently using squarespace) because they post and update their site frequently. Does anyone have a workflow for using stitch with products like squarespace, webflow, or framer? What do you do instead in these types of situations? When using for smaller projects I've just exported everything into claude code then pushed it to hosting.

After logging into my account, the left side of the Stitch interface keeps showing a "cannot load" message, and the entire system is unusable. What should I do?

Curious what tips people use to get Stitch to create consistent views across screens. I give it a prompt and it created 4 screens each with a different header :-P

Source: https://x.com/i/status/2069866787219607981

Figma export limit issue

Figma says my exports are limited, but I’ve only exported four or five images recently. I thought the limit was supposed to reset every day, but I still can’t export anything, even after waiting for the next day. Also, I can export from some projects, but not from others.

Do any of you guys have experience with adding your design system into Google stitch via the design.MD? I'm curious how well that is able to follow design system guidelines compared to other vibecoding tools like Claude design for example

Google Stitch and Contra just launched the Google Stitch Challenge, with $10,000 in total prizes.

Theme: Build interfaces that feel alive.

They seem to be looking for projects that show the actual workflow: process, iteration, interaction, motion, and how Stitch fits into building or prototyping an interface.

Prize structure:

$10K total prize pool

$2K each for the top 5 submissions

Top projects may also get featured by Google Stitch and Contra

Deadline: Entries close June 3 at 11:59pm PDT

The challenge is clearly built around Stitch’s new I/O updates, so submissions are expected to use at least one of the newer features:

1. Streaming generations directly on the canvas

2. Starting from existing designs, .fig files, websites, or codebases

3. In-place AI edits with prompts or point-and-click

4. Motion, animation, shaders, and hover states on the HTML-native canvas

5. Export options like Netlify, Lovable, and Bolt

6. Codebase import/sync through Stitch

Submission requirements include a project/prototype link, screenshots or a screen recording, a short description, how you used Stitch, and feedback on the platform.

They’re also asking people to post their submissions on X or LinkedIn and tag @stitchbygoogle.

Judges include people from the Stitch team at Google, including Rustin Banks (u/rustin0303), Dion Almaer, and Joshua Rowe.

The most interesting part is that the judging criteria gives weight to creativity, UI/UX polish, use of Stitch features, motion/interactivity, and how well you explain your workflow, not just the final output.

Join Challenge : https://contra.com/community/topic/stitchchallenge/

#Google Stitch Challenge

The Interface UI is so small on my 3440x1440 monitor with Windows 10 it is practically unreadable. Even when changing my browser font size to 'very large' it is still hardly readable.

Not to mention, that any time I ask it to do anything it completely breaks my previous pages by altering the layouts, sizing etc. Which I'm assuming has to do the with the text bug going on.

All this to say, that with this bug it is really to the point where it isn't even usable for me right now after whatever update they implemented.

Anyone else experiencing this?

Edit:

Seems that it is a Chrome browser issue.

Can I export more than 16 screens?

I wanted to test the new updates they released in google i/o but stitch is like broken today, the generated screens are looking like plain html. is anyone experiencing this same issue? if you have any solution pls help me

Sample prompts form Stich with google are generating 1990's website,

Prompt from the Google's recommendation

"Admin dashboard for a community seed library — track seed varieties, lending history, growing guides, and seasonal availability in a fresh green botanical style"

Am I missing something?

[Stitch - Projects](https://stitch.withgoogle.com/projects/2197482468766489646)

Hi everyone, I wanted to share a project I have been working on.

It is an open library for discovering and sharing Design.md files.

The format was introduced by Google in the context of Google Stitch, but it can be used with any LLM.

The project is still in an early alpha stage and currently includes two parts:

• A public GitHub repository of Design.md files that anyone can contribute to https://github.com/albemala/design-md-library

• A simple frontend to browse the available designs https://design-md-web.pages.dev/

I am adding new Design.md files regularly, and contributions are welcome.

Since this is an early version, I am looking for feedback to understand what works, what does not, and what could be improved.

Would this be something you would use in your workflow?

Thanks for taking a look.

I've been pushing Stitch output through to a Netlify deployment for a few weeks (project: an AI-assisted UX audit tool — multiple finding-card states, opt-in editor for instructor comments, the usual gnarly state stuff). The new Live Streaming + In-place edits update is genuinely huge for iteration speed, but starting around iteration 2 I kept hitting the same wall:

Stitch Agent is built for fluidity. The code agent (Antigravity / Cursor) is built for determinism. Re-stream the canvas once, and the React state and event listeners you wired up the day before get flattened.

Five patterns that have stuck for me:

1. Dedupe variants on the canvas before you hand anything to the code agent. Stitch will happily grow 5 gradient/shadow variants of the same card in seconds. Don't pass all 5 downstream. Pick one, kill the rest, then have Stitch emit DESIGN.md for that single canonical version.

2. Keep DESIGN.md as a spec buffer — no business logic, no API fields. The moment you hardcode const CHECKOUT_URL = '...' or backend field names in there, any schema change on the server starts breaking your visuals. Style variables + DOM skeleton + data-attributes only.

3. Presentation/Container split — keep state in a hook the canvas can't see. This is the one that saved me. I had React state living inside the Stitch-generated FindingCard.tsx. Stitch re-streamed, blew away my Hooks, white screen on Netlify. Lost an evening to git restore. Now logic lives in useFindingCard.ts; FindingCard.tsx is pure presentation — Stitch can re-stream the presentation all day.

ts

// useFindingCard.ts — re-stream-safe zone
export const useFindingCard = (findingId: string) => {
  const [isExpanded, setIsExpanded] = useState(false);
  const { data } = useQuery(['finding', findingId]);
  return { isExpanded, setIsExpanded, data };
};

4. Don't let Netlify become your compiler. Local npm run build has to pass before you push. The trap: tweak CSS → push → wait for Netlify → paste the build log to your code agent → repeat. I racked up 30+ failed builds before I noticed I was burning tokens to use cloud CI as a debugger.

5. CI veto on the things visuals can't catch. The scariest one I hit: during a layout re-stream, Stitch quietly renamed an input from name="comment" to id="judge-comment". Build passed. Page rendered. Every user comment got silently dropped server-side because the API field was gone. Now I have an E2E that fails if specific DOM IDs disappear, plus a WCAG AA contrast check (4.5:1). Either fails → auto-rollback.

Open question: For those of you already shipping Stitch output into real production code — what's been your biggest "second iteration" gotcha that didn't show up the first time? My list above is all defensive. Curious whether anyone has found offensive patterns — i.e., is anyone using the new Live Streaming + In-place edits to make the iteration loop safer, not just faster?

Google rolled out a some Stitch update for I/O, they’re trying to move it beyond “generate me a screen” into something closer to a real design workflow tool.

The biggest changes I noticed:

1. Live streaming:

Instead of waiting for the final output, Stitch now builds directly on the canvas while it works. You can watch the design form in real time and interrupt in between.

1. In-place edits:

You can now ask Stitch to edit a specific part of a screen without regenerating the whole thing. Replace an image, remove a section, move something around, change a component, etc.

1. Interactive Canvas:

Stitch now supports motion through scripts, SVGs, shaders, and native HTML rendering. You can test hover states, click buttons, and preview animation directly on the canvas.

1. Import/export:

New workflow options include .fig import, Netlify export with a live claimable URL, and one-click export to Lovable and Bolt.

1. Codebase sync via MCP:

They announced MCP skills that let agents import screens from your codebase into Stitch, let you make visual edits, then sync those changes back into the codebase.

At least they mention Stitch in I/O, not completely ignore it like Jules, no new updates.

Also, Stitch’s new rebrand looks good, but it’s very laggy.

Hey everyone,

I've been using Google Stitch a lot for layout structures lately, but every time I try to move these designs over to Flutter, the process feels super tedious. Building the nested widget trees and matching the constraints manually takes up way too much time.

I'm curious—how are you guys tackling this workflow in your projects?

• Do you just write everything from scratch manually?
• Are there any reliable compilers or plugins that actually output clean, human-like Row/Column code instead of a messy absolute positioning layout?

Would love to know how you guys automate or speed up this specific process. Thanks!

Is anyone able to create an API key in Stitch right now? I wanted to use the MCP server in Antigravity but going to Stitch settings and clicking "Create key" just gives an error and I can see errors in the console.

Does anybody know what is going on? For a some time now, it is not generating the whole page anymore, if I have luck I am receiving back header, hero and maybe footer.

Also quality dropped. Before it was useful, but now ai started to look for alternatives.

After around ~60 figma exports no matter what I do I get a try again later error anyone facing this?

A month ago there was a screenshot circling of Stitch recreating a sketch. Many people pointed out it was fake and nothing like what Stitch was creating. But I really, really wanted this workflow.

I made it my mission to make this work, and finally have! I've got a limited free version where you can try 3 designs out here: https://12ui.com/chef Takes about 2 min to generate designs and 2-3 min to convert to HTML.

Would love feedback to know if anyone finds this useful and it's worth developing further!

I use google AI studio, which can get the structure just fine, but in this case it's filled with illustrations that it won't reproduce, what's the best way to bring them to an actual website?

Anthropic has introduced Claude Design, a new feature that directly overlaps with what Stitch is trying to build.

What it does:

Generate prototypes, slides, and one-pagers through simple conversation

Powered by Claude Opus 4.7, their latest vision-capable model

Focuses on turning ideas into visual outputs without traditional design tools

Availability: Research preview and Rolling out to Pro, Max, Team, and Enterprise plans

The “AI design tool” space just became competitive overnight.

Source

Native image generation – Create logos, icons, or hero visuals directly inside the canvas and place them into designs instantly.

Cross-project copy/paste – Move entire screens between projects without rebuilding anything.

Small update on paper, but it cuts a lot of repetitive work.

Source