Google Stitch Review (2026): Är det gratis? Funktioner, Figma Export, MCP och alternativ22 min read

Google Stitch är ett gratis AI-designverktyg från Google Labs som förvandlar en textuppmaning, en bild eller en webbplatsreferens till gränssnittsskärmar med hög kvalitet och sedan låter dig förfina dem på en oändlig duk och exportera till Figma, kod, Google AI Studio eller Antigravity. Det började i maj 2025 som ett prompt-to-UI-experiment och blev en AI-native designcanvas i mars 2026. Den här recensionen är till för designers, produktchefer och grundare som vill veta vad Stitch gör bra, var det slutar och om det kan ersätta Figma.

Fakta återspeglar Googles egna tillkännagivanden, Googles utvecklardokument och offentliga användarrapporter från och med november 2026. Stitch är en Google Labs-produkt, så funktioner och begränsningar ändras ofta. Bekräfta aktuell information på stitch.withgoogle.com. Denna recension bygger på Googles officiella material och offentliga användarrapporter.

Vår dom på en rad: Stitch är det bästa gratis sättet att snabbt utforska UI-riktningar, och dess kopplingar till Google AI Studio och Antigravity är verkligen användbara för byggare. Det är inte en Figma-ersättare. Output kan kännas generiskt, export till Figma kommer ofta som platt struktur och Google publicerar inte en fast gräns för fria nivåer eller en långsiktig plan. Nedan hittar du funktionerna, gränserna, Figma och kodexport, MCP, en steg-för-steg-genomgång med exempeluppmaningar, vad användarna säger och de bästa alternativen, inklusive Anima Playground.

I AI-tiden är design kod. För att designa direkt i kod med AI, eller för att förvandla dina Figma-designer till kod, använd Anima lekplats: beskriv en skärm eller utgå från en Figma-design, fortsätt sedan att iterera på en redigerbar app som du kan förhandsgranska och publicera.

Google Stitch granskning: snabb dom

Bäst för gratis utforskning och för byggare i Google-stacken. Mindre lämpad för team som behöver inbyggda Figma-komponenter, strikt varumärkeskontroll eller en garanterad långsiktig produkt.

Vad är Google Stitch?

Stitch är ett experiment från Google Labs som genererar användargränssnitt från naturligt språk, bilder och andra sammanhang. Google förvärvade Galileo AI i maj 2025 och lanserade Stitch på Google I/O den månaden, byggt på Gemini 2.5. Galileo-användare fick 30 dagar på sig att migrera. Om du sökte efter Galileo AI är det här produkten som ersatte den.

Tidslinje för vad som förändrades

Google Stitch-funktioner 2026

Uppmaning, bild, URL eller röst till UI

Du kan börja med att förklara affärsmålet, känslan du vill ha eller en referens istället för att rita en wireframe. Stitch accepterar också bilder, text och kod som sammanhang på duken, och du kan prata med duken för kritik och liveförändringar. Uppmaningsrutan har en app- och webbväxel och en modellväljare, som Googles egna demos visar som alternativ som 3 Flash och 3.1 Pro.

Infinite canvas, designagent och Agent manager

Duken rymmer skärmar, referenser och idéer på ett ställe. Designagenten resonerar över hela projektet och agentchefen spårar flera utforskningar parallellt. Vid I/O 2026 lade Google till realtidsströmning, så att du ser Stitch bygga en sida och kan styra den innan den är klar.

Designsystem och DESIGN.md

Stitch kan extrahera ett designsystem från vilken URL som helst, och det använder DESIGN.md, en Markdown-fil med designtokens i YAML plus skriftlig motivering för färger, typ, avstånd och komponenter. Du kan exportera den, importera den till ett annat Stitch-projekt eller dela den med en kodningsagent. Google öppnade utkastet till specifikation i april 2026 så att andra verktyg kan använda det.

Omedelbar prototyper

Du kan länka samman skärmar och trycka på Play för att klicka dig igenom ett flöde. Stitch kan också generera logiska nästa skärmar från ett klick, som kartlägger en resa snabbt. För varför flöden och prototyper spelar roll i olika skeden, se wireframes vs prototyper.

Dela, publicera och exportera

Från arbetsytan kan du skapa en delbar länk via Google AI Studio, exportera till Google Antigravity för att lägga till backend-logik eller publicera på webben med Netlify. Googles egen exportpanel i I/O-demon listar Google AI Studio, Google Antigravity via MCP och Figma.

Är Google Stitch gratis? Prissättning och gränser

Ja. Stitch är gratis med ett Google-konto på stitch.withgoogle.com och det finns ingen avgift. Det är en Google Labs-produkt, tillgänglig för personer 18 år och äldre i ett stort antal länder, så det kanske inte erbjuds överallt.

Det praktiska rådet är att utforska i snabbläge, spara Pro-modellen för skärmar du planerar att skicka och exportera färdigt arbete samma dag.

Google Stitch to Figma: hur export fungerar

Stitch stöder Kopiera till Figma och klistra in, och Google visar Figma i sin exportpanel. I praktiken spelar detaljerna roll:

• Rapporter på Googles utvecklarforum och Reddit säger att Copy to Figma inte erbjuds för design gjorda i Thinking- eller Pro-lägena, så kvalitet och Figma-export kan dra i motsatta riktningar.
• Reddit-användare beskriver importer där text anländer som vektorer och ramar används som mellanrum i automatisk layout, så mycket av resultatet måste byggas om.
• En vanlig lösning är att ladda ner Stitch-koden och föra den till Figma med ett plugin som html.to.design, som tenderar att ge en mer trogen import.

Det vettiga arbetsflödet är att avsluta iterationen i Stitch, exportera en gång och sedan bygga om korrekta komponenter och tokens i Figma. Varje regenerering ogiltigförklarar manuell rensning du gjorde vid en tidigare export. Om du vill ha en agent inuti Figma som redan respekterar dina komponenter, titta på Animas Buddy eller UX Pilots Nodey.

Google Stitch-kodexport och MCP

Stitch har producerat front-end-kod sedan lanseringen, och recensioner beskriver HTML med Tailwind-klasser som utvecklare kan använda som utgångspunkt. Behandla det som en byggnadsställning: en stor komponent med statisk data är ett vanligt resultat, så planera för att dela upp komponenter och kabelstatus.

Stitch MCP-servern och SDK är den mer intressanta utvecklarhistorien. En kodningsagent som Google Antigravity kan hämta ditt projekt, läsa designsymbolerna och skärmarna och bygga utifrån dem. Googles eget codelab går igenom att skapa en API-nyckel i Stitch-inställningarna, lägga till Stitch MCP i Antigravity, skapa en DESIGN.md och bygga en React and Tailwind-webbplats. MCP-referensen listar verktyg för att skapa projekt, generera skärmar från text, redigera skärmar, generera varianter och hantera designsystem, inklusive uppladdning av en DESIGN.md.

Om ditt slutmål är en fungerande React- eller HTML-app snarare än en designfil, jämför den här vägen med Anima lekplats, som bygger den redigerbara appen direkt.

Hur man använder Google Stitch: en steg-för-steg-guide

Den här genomgången följer Googles egna tillkännagivanden, utvecklardokument och I/O-demovideor. Uppmaningarna nedan är utgångspunkter för att prova själv, och resultaten varierar från körning till körning. Bilderna är Googles officiella bilder, krediterade som sådana, plus en vy av den offentliga målsidan. Sömmen ändras ofta, så knappnamn och modellnamn kan skilja sig åt när du öppnar den.

Om du också vill jämföra verktyg, prova samma prompt för växtbyte nedan i Stitch och i UX Pilot. Vår UX Pilot recension visar hur den uppmaningen blev där, så att du kan jämföra de två med checklistan i slutet.

Steg 1: öppna Stitch och logga in

Gå till stitch.withgoogle.com och logga in med ett Google-konto. Stitch är en Google Labs-produkt för personer över 18 år i länder som stöds. Den offentliga målsidan är en enda uppmaningsruta med en app- och webbväxel, ett modellchip och några startförslag.

I skrivande stund står modellchippet på den offentliga sidan Balanserad, medan Googles I/O-demo-ramar visar modellnamn som 3 Flash och 3.1 Pro. Namn och alternativ ändras mellan versioner, så välj vilka snabba och högkvalitativa alternativ som appen erbjuder under dagen.

Steg 2: välj App eller Web och en modell

Växeln talar om för Stitch om du designar en inbyggd mobilapp eller en webbsida. Googles egen demo använder webben. Välj App för anläggningsbytesprompten nedan. För att skydda dina fria generationer, utforska med den snabbare modellen och behåll modellen av högre kvalitet för skärmar du planerar att skicka. Gränserna täcks ovan i prisavsnittet.

Steg 3: Skriv en uppmaning med sammanhang

Googles vägledning är att börja med affärsmålet, känslan du vill att användarna ska ha, eller exempel på vad som inspirerar dig, istället för en wireframe. Stitch accepterar också bilder, text och kod som sammanhang på duken, och det kan extrahera ett designsystem från en URL. Här är Googles egen demo-prompt från I/O-videon, som visas på skärmen i promptbox-bilden tidigare i denna recension:

bygga en responsiv målsida för willamette pizza co. för färgpalett låter vi ha den primära bakgrunden en varm benvit, den sekundära bakgrunden vara en ljus, mjuk himmelsblå och ha en livlig himmelsblå accentfärg…

Och här är ett kort du kan prova på både Stitch och UX Pilot. Välj App, klistra in den och skicka:

En mobilapp för en stadsdel som byter växter: hemflöde, växtdetaljsida och chattskärm. Ren, vänlig, grön accent.

Tips som följer Googles vägledning: namnge de skärmar du vill ha, ange känslan (ren, vänlig), ge en accentfärg och bifoga en referensbild om du har en.

Steg 4: se den generera och styra

Vid I/O 2026 sa Google att Stitch nu strömmar sitt arbete direkt till duken, så att du kan se en sida ta form. Stitch Agent låter dig styra iterationer innan resultatet är slutgiltigt, och agenthanteraren spårar flera utforskningar parallellt. I Googles demo kan du också prata med duken för att be om kritik eller ändringar.

Steg 5: redigera med uppföljningsmeddelanden

När skärmar finns, förfina dem med korta uppföljningar i chatten, eller välj en skärm och be om en ändring. Stitchs MCP-referens listar också verktyg för att redigera skärmar och för att generera varianter, vilket är användbart när du vill ha flera riktningar på en skärm. En uppföljning du kan prova på resultatet av plantbyte:

Gör hemflödet till ett rutnät med två kolumner och lägg till ett sökfält

När du jämför verktyg, notera om resten av skärmen förblir densamma efter en redigering, eftersom redigeringar i regenereringsstil kan ändra områden som du inte frågade om.

Steg 6: tillämpa ett designsystem med DESIGN.md

Stitch kan hämta ett designsystem från en URL, och det lagrar designregler i DESIGN.md, en Markdown-fil med tokens och skriftlig motivering. Du kan exportera den, importera den till ett annat Stitch-projekt eller överlämna den till en kodningsagent. Googles demo tillämpar ett designsystem på en hel webbplats med en uppmaning på vanligt språk:

Tillämpa detta designsystem på hela webbplatsen.

Steg 7: länka skärmar och tryck på Play

Google säger att du kan sy ihop skärmar på några sekunder och klicka på Spela för att förhandsgranska flödet. Stitch kan också generera logiska nästa skärmar från ett klick, vilket hjälper dig att kartlägga en resa snabbt. För växtbytesappen länkar du flödet till detaljsidan och detaljsidan till chatten och klickar sedan vidare.

Steg 8: dela och exportera

Öppna Exportera när du är klar. Googles I/O-demo visar Google AI Studio, Google Antigravity via MCP och Figma. Du kan också skapa en delbar länk via AI Studio, eller publicera på webben med Netlify. För utvecklare behöver Stitch MCP och SDK en API-nyckel från Stitch-inställningarna, som Googles codelab beskriver. Läs Figma-exportanteckningarna ovan innan du litar på Copy to Figma.

En checklista för att bedöma ditt eget resultat

• Finns varje skärm du namnger, med realistiskt innehåll istället för platshållartext?
• Är accentfärgen och typen konsekvent på alla skärmar?
• Efter redigeringsuppmaningen, ändrades bara det begärda området?
• Hur många generationer använde prospekteringen och hur lång tid tog städningen i Figma?

Källor: Googles vibe design meddelande, den I/O-designuppdatering i realtid och den DESIGN.md tillkännagivande.

Vad användare säger om Google Stitch

• Berömd: hastighet, en generös gratis nivå, multi-screen generation, duken, designsystemextraktion och utvecklaren länkar till AI Studio, Antigravity och MCP.
• Kritiserade: vanlig eller generisk produktion även med referenser, svag kontroll över komplexa SaaS- och företagsdesigner, Figma-exporter som behöver byggas om, att nå månatliga generationsgränser och enstaka generationsfel som rapporteras på Googles forum.

En designer på r/UX_Design säger att Stitch är ”ett fantastiskt verktyg för idéer och snabb iteration”, men att resultaten förblev ”mycket enkla och generiska” även efter att ha lagt till referenser. En användare på r/StitchAI säger att mycket av det de får tillbaka måste återskapas från början efter import till Figma. Båda är individuella rapporter, inte uppmätta priser.

Google Stitch för- och nackdelar

Google Stitch vs Figma: kan Stitch ersätta Figma?

Nej, och Google placerar det inte på det sättet. Stitch äger noll-till-ett-fasen: utforska vägbeskrivningar, skaffa en första design och överlämna den till kod. Figma äger förfining, komponenter, variabler, samarbete och handoff för stora team. De två möts vid exportsteget, det är där det mesta av friktionen finns.

Om du vill se Figmas eget AI-prototypverktyg, läs vår guide till Figma Make.

Bästa Google Stitch-alternativen

1. Anima lekplats

Välj Anima Playground när du vill designa direkt i kod. Beskriv en skärm eller utgå från en Figma-design, en bild eller en webbadress, fortsätt sedan att iterera på en redigerbar HTML- eller React-app som du kan förhandsgranska, dela och publicera. Stitch är ett designutforskningsverktyg som exporterar kod. Playground behandlar den fungerande appen som designen, så avstånd, tillstånd och responsivt beteende är synliga medan du itererar. Det är inte en källa till inhemska Figma-lager, så koppla ihop det med Anima Figma-plugin eller Buddy om du behöver det.

2. UX Pilot

Bättre för Figma-centrerade team: Nodey körs inuti Figma, importerar dina komponenter och genererar inbyggda lager. Det kostar krediter utöver en gratis dagpenning. Se vår UX Pilot recension.

3. Figma Make

Interaktiva prototyper inuti Figma. Läs vad Figma Make är eller den Figma Make vs Anima Playground jämförelse.

4. Claude Design

Chattledda koncept, bilder och prototyper med en Claude Code handoff. Se vår Claude Design recension.

5. Buddy av Anima

En AI-designagent inom Figma som använder ditt designsystemkontext. Välj det om du vill stanna på Figma-duken.

Vem ska använda Google Stitch?

• Grundare och PM som behöver en trovärdig första design utan att betala för ett verktyg.
• Designers utforska många riktningar innan Figma öppnas.
• Utvecklare som vill ha designkontext för Antigravity eller annan MCP-kapabel agent.

Leta någon annanstans om du behöver strikt varumärkeskontroll, inbyggda Figma-komponenter, garanterad kapacitet eller en stabil långsiktig produkt.

Slutlig dom: är Google Stitch värt det?

Ja, som ett gratis utforskningsverktyg. Använd den för att få flera vägbeskrivningar snabbt, flytta sedan vinnaren till Figma eller en kodningsagent och exportera samma dag. Planera inte ett byråarbetsflöde förrän Google publicerar gränser och en färdplan. Om du vill att designen och den fungerande appen ska hålla ihop, prova Anima Playground nästa.

Designa direkt i kod med AI

Design med AI: Beskriv en skärm eller förvandla Figma-designer till kod.

Vanliga frågor om Google Stitch

Vad är Google Stitch?

Google Stitch är ett Google Labs AI-verktyg som genererar högfientlig UI-design och front-end-kod från textmeddelanden, bilder och andra sammanhang på en oändlig duk. Det lanserades i maj 2025 och ersatte Galileo AI, som Google förvärvade.

Är Google Stitch gratis?

Ja. Stitch är gratis med ett Google-konto och har ingen betalplan. Månatliga generationsgränser gäller, och Googles support citerade 350 standardgenerationer och 50 experimentgenerationer per månad i augusti 2025. Senare rapporter skiljer sig åt, så kontrollera den aktuella gränsen i appen.

Hur loggar jag in på Google Stitch?

Gå till stitch.withgoogle.com och logga in med ett Google-konto. Stitch är en Google Labs-produkt för användare 18 år och äldre, och den kanske inte är tillgänglig i alla länder.

Kan Google Stitch exportera till Figma?

Ja, med Kopiera till Figma och klistra in, men det rapporteras som otillgängligt för vissa lägen och kommer ofta som platta lager. Många användare laddar ner koden och importerar den med ett plugin som html.to.design istället.

Har Google Stitch en MCP-server?

Ja. Stitch MCP-servern och SDK låter kodningsagenter som Google Antigravity läsa dina projekt, generera skärmar och använda ditt designsystem. Du skapar en API-nyckel i Stitch-inställningarna för att ansluta.

Vilka är de bästa Google Stitch-alternativen?

Anima Playground är ett starkt val om du vill ha en redigerbar HTML- eller React-app från en prompt eller Figma-design. UX Pilot passar Figma-team, Figma Make passar interaktiva prototyper i Figma och Claude Design passar chattledda koncept.