Stitch is Google’s AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.
Stitch is Google’s AI UI design tool. Connected to WPOS, the agent can generate
screens from a prompt, read the code and styles behind an existing screen, and
carry a design’s fonts, colors, and layout into the site it is building.Category: Design and forms Actions available: 9
Stitch is a first-party WPOS connector, not part of the Composio catalog. It
runs on Google’s own hosted Stitch MCP server, so its tools update as Google
ships them. Stitch is in beta, so expect the interface to move.
What you can do
Generate new UI screens from a text prompt, straight from chat
Browse your Stitch projects and screens
Pull a screen’s frontend code and high resolution screenshot for implementation
Extract Design DNA, meaning fonts, colors, and layout, to keep new work on style
List my Stitch projects.Generate a pricing page screen in Stitch, then build it on this site.Pull the Design DNA from that screen and apply it to the homepage.
A Stitch API key, created from your profile menu. The steps below cover it.
No popups needed. Stitch takes a key directly, with no OAuth round trip.
Connect it
1
Open WPOS
In WordPress admin, open WPOS. You land on the chat screen.
WPOS opens on the chat screen.
2
Open a new tab and choose Connectors
Click the + button to open the launcher panel, then choose Connectors.
The launcher panel. Connectors is the fifth entry.
3
Find the connector
Every available connector is listed alphabetically, each with a button showing what it needs.
The Connectors panel, sorted alphabetically.
4
Search for Stitch and press Connect
Type Stitch into Search for integrations, then press Connect on the row.
The Stitch row, described as AI UI design, Screens, Design DNA.
5
The Stitch panel asks for a key
Instead of a popup, WPOS opens the Stitch panel with a single field for your API
key, plus the feature list, notes, and the nine tools it exposes.Leave it open and create the key next.
The Stitch panel, with the key field above its feature list.
6
Create an API key in Stitch
In stitch.withgoogle.com, open your profile
picture, then Stitch settings, then API key. Click Create key.
Stitch runs abuse auto-detection: any key it finds publicly exposed is
disabled automatically. That protects you, but it also means a key pasted
into a public repo or a shared screenshot stops working without notice.
The Stitch API key page before any key exists.
7
Copy the key
The new key appears in the table with its creation date and last used time.
Stitch only ever displays the last few characters of a key, so this page
cannot leak the full value later. Copy it when it is first shown. If you
lose it, delete the key and create another.
The key, listed with only its final characters visible.
8
Paste it into WPOS and connect
Back in the Stitch panel, paste the key into the field, where it masks as you
paste, and click Connect.The row then reads Connected with View Details, and Stitch’s nine tools
become available to the agent.
Like Figma and Jotform, Stitch keeps Disconnect inside the detail panel.
Click View Details to reach it. The row itself has no Disconnect button.
Connected. Disconnect lives behind View Details.
Tools
Tool
What it does
list_projects
List all your available Stitch projects
get_project
Retrieve details of a specific project
create_project
Create a new Stitch project
list_screens
List all screens within a project
get_screen
Get metadata for a specific screen
generate_screen_from_text
Generate a new screen from a text prompt and design context
fetch_screen_code
Download the frontend code of a screen
fetch_screen_image
Download the high resolution screenshot of a screen
extract_design_context
Scan a screen to extract its Design DNA: fonts, colors, layouts
Disconnect
Press View Details on the row, then Disconnect inside the panel. The
stored key is removed from WordPress. Your Stitch projects and screens are
untouched.To invalidate the key entirely, also delete it in Stitch under Stitch
settings, then API key, using the delete icon on the row. Disconnecting in
WPOS does not revoke it on Google’s side.
Troubleshooting
The key was accepted but stopped working later
Stitch disables keys it detects as publicly exposed. If the key was ever pasted
into a public repo, a ticket, or a shared screenshot, assume it was caught.
Create a new key and reconnect.
The key was lost before it was saved
Stitch shows only the last few characters after creation, so there is nothing
to recover. Delete the key and create another.
No projects are returned
The account behind the key has no Stitch projects yet. Create one at
stitch.withgoogle.com first, then ask again.
The row has no Disconnect button
Correct behaviour. Stitch, Figma, and Jotform all keep Disconnect inside the
detail panel. Click View Details to reach it.
Tools changed without an update to WPOS
Expected. Stitch runs on Google’s hosted MCP server, so the tool set follows
what Google ships rather than the WPOS release cycle. Stitch is in beta, so
this happens more often than with other connectors.
Canva, for finished artwork rather than UI screens
Was this page helpful?
{"docsConfig":{"theme":"mint","$schema":"https://mintlify.com/docs.json","name":"WPOS","description":"WordPress, finally operated. The operator manual for running WordPress sites with WPOS.","colors":{"primary":"#062565","light":"#89CAFF","dark":"#0A3A8F"},"logo":{"light":"https://mintcdn.com/wpos/r3ng18J_nwt1_fD2/logo/light.svg?fit=max\u0026auto=format\u0026n=r3ng18J_nwt1_fD2\u0026q=85\u0026s=67939bfd870e9c049cc8758c0d204b2b","dark":"https://mintcdn.com/wpos/r3ng18J_nwt1_fD2/logo/dark.svg?fit=max\u0026auto=format\u0026n=r3ng18J_nwt1_fD2\u0026q=85\u0026s=3b51beaae8bc10056a48a7979e2003e4","href":"https://wpos.ai"},"favicon":"https://mintcdn.com/wpos/JjJVXqByJvEYoF5u/favicon.png?fit=max\u0026auto=format\u0026n=JjJVXqByJvEYoF5u\u0026q=85\u0026s=72e51f12f02f818bbff4787ef2044acd","navbar":{"primary":{"type":"button","label":"Open the app","href":"https://app.wpos.ai"}},"footer":{"socials":{"x":"https://x.com/wpos_ai","website":"https://wpos.ai"}},"seo":{"metatags":{"og:site_name":"WPOS Docs"}},"fonts":{"family":"Inter Tight"},"integrations":{"posthog":{"apiKey":"phc_WpD8BFKAYUNIpEUU7ggxUue33nwbYg36d2Qyx0AlmqD","apiHost":"https://us.i.posthog.com","sessionRecording":true}},"contextual":{"options":["copy","view"],"display":"header"},"styling":{"latex":true},"navigation":{"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"wpos","hasAudioNarration":false,"actualSubdomain":"wpos","customDomains":["docs.wpos.ai"],"gitSource":{"type":"github","owner":"wpcursor","repo":"wpos-docs","deployBranch":"main","contentDirectory":"","isPrivate":true,"mountPath":"","label":""},"feedback":{"thumbs":true},"entitlements":{"AI_CHAT":{"status":"DISABLED"}},"buildId":"6af1e9b5ab0bbd1215017c8b","clientVersion":"0.0.4128","searchFilterCounts":[{"language":"default","tag":"Introduction","count":38},{"language":"default","tag":"Elementor Ultra","count":27},{"language":"default","tag":"Connectors","count":20},{"language":"default","tag":"Operate","count":11},{"language":"default","tag":"For agencies","count":10},{"language":"default","tag":"Partners","count":10},{"language":"default","tag":"Get started","count":9},{"language":"default","tag":"Build","count":9},{"language":"default","tag":"Examples","count":9},{"language":"default","tag":"Guides","count":5}]},"assistantConfig":{"enableAskAiButton":false,"enableStarterQuestions":false,"enableContextualStarterQuestions":false,"enableAskAiSearchBar":true},"basePath":"","hasChatPermissions":false,"hasWebMcpPermissions":false,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-rbac-roles","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"rbac-expansion","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"full-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-dual-write","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"approve-review-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-metadata","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"sso-setup-deadline-banner","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-serve","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"live-agents","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"googleFontsInlined":true},"customCss":[{"filePath":"style.css","content":"html.dark{--background-dark: 11 11 11;--gray-950: 11 11 11;--gray-900: 23 23 23;--default-border-color: 34 34 34;--gray-800: 66 66 66}html.light{--background-light: 255 255 255;--default-border-color: 229 229 229}.demo-embed{margin:1.75rem 0}.demo-embed+.demo-embed{margin-top:2.75rem}.demo-embed video,.demo-embed iframe{display:block;width:100%;aspect-ratio:16 / 9;border:0;border-radius:14px;background:#0B0B0B}.yt-facade{position:relative;display:block;width:100%;aspect-ratio:16 / 9;padding:0;border:0;border-radius:14px;overflow:hidden;cursor:pointer;background:#0B0B0B}.yt-facade-thumb{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .45s ease, filter .3s ease}.yt-facade:hover .yt-facade-thumb{transform:scale(1.02);filter:brightness(.88)}.yt-facade-play{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:72px;height:72px;padding:0;border-radius:50%;color:#FFFFFF;background:rgba(6, 37, 101, .88);box-shadow:0 6px 24px rgba(0,0,0,.35);transform:translate(-50%, -50%);transition:transform .2s ease, background .2s ease}.yt-facade-play svg{display:block;flex:none}.yt-facade:hover .yt-facade-play{background:#0A3A8F;transform:translate(-50%, -50%) scale(1.06)}.yt-facade:focus-visible{outline:3px solid #89CAFF;outline-offset:3px}.demo-caption{margin:0.7rem 0 0;text-align:center;font-size:0.85rem;line-height:1.4;color:rgb(115 115 115)}html.dark .demo-caption{color:rgb(150 150 150)}"}],"page":{"pagePath":"connectors/stitch","slug":"/connectors/stitch","pageMetadata":{"title":"Stitch","icon":"table-cells-large","description":"Stitch is Google's AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.","href":"/connectors/stitch"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Stitch is Google’s AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];const YouTubeVideo=({id,title,caption})=>{const[playing,setPlaying]=useState(false);return _jsxs(`div`,{className:`demo-embed`,children:[playing?_jsx(`iframe`,{src:`https://www.youtube-nocookie.com/embed/${id}?autoplay=1\u0026rel=0\u0026playsinline=1`,title,allow:`accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share`,referrerPolicy:`strict-origin-when-cross-origin`,allowFullScreen:true}):_jsxs(`button`,{type:`button`,className:`yt-facade`,onClick:()=>setPlaying(true),\"aria-label\":`Play video: ${title}`,title,children:[_jsx(`span`,{className:`yt-facade-thumb`,style:{backgroundImage:`url(https://i.ytimg.com/vi/${id}/maxresdefault.jpg)`},\"aria-hidden\":`true`}),_jsx(`span`,{className:`yt-facade-play`,\"aria-hidden\":`true`,children:_jsx(`svg`,{width:`26`,height:`26`,viewBox:`0 0 24 24`,fill:`currentColor`,children:_jsx(`path`,{d:`M8 5.14v13.72a1 1 0 0 0 1.52.85l10.97-6.86a1 1 0 0 0 0-1.7L9.52 4.29A1 1 0 0 0 8 5.14z`})})})]}),caption?_jsx(`p`,{className:`demo-caption`,children:caption}):null]})};function _createMdxContent(props){const _components={a:`a`,code:`code`,li:`li`,p:`p`,pre:`pre`,span:`span`,strong:`strong`,tbody:`tbody`,td:`td`,th:`th`,thead:`thead`,tr:`tr`,ul:`ul`,..._provideComponents(),...props.components},{Accordion,AccordionGroup,CodeBlock,Frame,Heading,Note,OptimizedImage,Step,Steps,Table,Tip,_MdxComponentBoundary}=_components;if(!Accordion)_missingMdxReference(`Accordion`,true);if(!AccordionGroup)_missingMdxReference(`AccordionGroup`,true);if(!CodeBlock)_missingMdxReference(`CodeBlock`,true);if(!Frame)_missingMdxReference(`Frame`,true);if(!Heading)_missingMdxReference(`Heading`,true);if(!Note)_missingMdxReference(`Note`,true);if(!OptimizedImage)_missingMdxReference(`OptimizedImage`,true);if(!Step)_missingMdxReference(`Step`,true);if(!Steps)_missingMdxReference(`Steps`,true);if(!Table)_missingMdxReference(`Table`,true);if(!Tip)_missingMdxReference(`Tip`,true);if(!_MdxComponentBoundary)_missingMdxReference(`_MdxComponentBoundary`,true);return _jsxs(_Fragment,{children:[_jsx(_components.p,{children:`Stitch is Google’s AI UI design tool. Connected to WPOS, the agent can generate\nscreens from a prompt, read the code and styles behind an existing screen, and\ncarry a design’s fonts, colors, and layout into the site it is building.`}),`\n`,_jsx(_MdxComponentBoundary,{name:`YouTubeVideo`,children:_jsx(YouTubeVideo,{id:`ton8wnQOzNY`,title:`Connect Google Stitch to WPOS`,caption:`Turn Stitch designs into WordPress pages`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Category:`}),` Design and forms `,_jsx(_components.strong,{children:`Actions available:`}),` 9`]}),`\n`,_jsx(Note,{children:_jsxs(_components.p,{children:[`Stitch is a first-party WPOS connector, not part of the Composio catalog. It\nruns on Google’s own hosted Stitch MCP server, so its tools update as Google\nships them. Stitch is in `,_jsx(_components.strong,{children:`beta`}),`, so expect the interface to move.`]})}),`\n`,_jsx(Heading,{level:`2`,id:`what-you-can-do`,children:`What you can do`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Generate new UI screens from a text prompt, straight from chat`}),`\n`,_jsx(_components.li,{children:`Browse your Stitch projects and screens`}),`\n`,_jsx(_components.li,{children:`Pull a screen’s frontend code and high resolution screenshot for implementation`}),`\n`,_jsx(_components.li,{children:`Extract Design DNA, meaning fonts, colors, and layout, to keep new work on style`}),`\n`]}),`\n`,_jsx(Heading,{level:`2`,id:`example-requests`,children:`Example requests`}),`\n`,_jsxs(_components.p,{children:[`Once Stitch is connected, ask in the `,_jsx(_components.a,{href:`/operate/command-center`,children:`Command Center`}),`:`]}),`\n`,_jsx(CodeBlock,{filename:``,numberOfLines:`4`,language:`text`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`text`,children:_jsxs(_components.code,{language:`text`,numberOfLines:`4`,children:[_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`List my Stitch projects.`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Generate a pricing page screen in Stitch, then build it on this site.`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Pull the Design DNA from that screen and apply it to the homepage.`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{})})]})})}),`\n`,_jsx(Heading,{level:`2`,id:`before-you-connect`,children:`Before you connect`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[`A Stitch account at `,_jsx(_components.a,{href:`https://stitch.withgoogle.com`,children:`stitch.withgoogle.com`}),`.`]}),`\n`,_jsxs(_components.li,{children:[`A `,_jsx(_components.strong,{children:`Stitch API key`}),`, created from your profile menu. The steps below cover it.`]}),`\n`,_jsx(_components.li,{children:`No popups needed. Stitch takes a key directly, with no OAuth round trip.`}),`\n`]}),`\n`,_jsx(Heading,{level:`2`,id:`connect-it`,children:`Connect it`}),`\n`,_jsxs(Steps,{children:[_jsxs(Step,{title:`Open WPOS`,children:[_jsxs(_components.p,{children:[`In WordPress admin, open `,_jsx(_components.strong,{children:`WPOS`}),`. You land on the chat screen.`]}),_jsx(Frame,{caption:`WPOS opens on the chat screen.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=22bb5ed7e9aaead0f0d43d989775f136`,alt:`The WPOS chat screen in WordPress admin.`,\"data-og-width\":`1918`,width:`1918`,\"data-og-height\":`876`,height:`876`,\"data-path\":`images/connectors/stitch/01-wpos-home.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=96439660eef40491cadee47b07e9e897 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=1d7bceb022c0e467ca337308ce98f131 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=b67e4974731f256bda20e2a669309c8a 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=9a707629ca57a64ab3c81ef23b520834 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=921bf67fbbd13a40aafeb5408ec8e80b 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/01-wpos-home.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=222eb8bbee5c793a7a6cb4afc95bd9ca 2500w`})})]}),_jsxs(Step,{title:`Open a new tab and choose Connectors`,children:[_jsxs(_components.p,{children:[`Click the `,_jsx(_components.strong,{children:`+`}),` button to open the launcher panel, then choose `,_jsx(_components.strong,{children:`Connectors`}),`.`]}),_jsx(Frame,{caption:`The launcher panel. Connectors is the fifth entry.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=1918edb1d5f9354ab8a0ad390ad2c9d4`,alt:`The WPOS launcher panel listing Preview, Site tree, Files, Skills, Connectors, and Settings.`,\"data-og-width\":`1920`,width:`1920`,\"data-og-height\":`887`,height:`887`,\"data-path\":`images/connectors/stitch/02-new-tab-connectors.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=2fa199eb8fe2376046b646c3382ff7d6 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=ab9674352f3c19c382117b0bb5bf661a 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=20fdf66159f9a340324e635342d93e01 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=afecde3c0b015990ee1ad7cc41791805 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=2cdd93a68d110e8be66545b66a1dd465 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/02-new-tab-connectors.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=d1b185c25e3665730b420be22bd4f82b 2500w`})})]}),_jsxs(Step,{title:`Find the connector`,children:[_jsx(_components.p,{children:`Every available connector is listed alphabetically, each with a button showing what it needs.`}),_jsx(Frame,{caption:`The Connectors panel, sorted alphabetically.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=7c7ea152ad3706c7031f7341d16ec98d`,alt:`The WPOS Connectors panel listing Calendly, Canva, Figma, Google Analytics, Google Calendar, and Google Docs.`,\"data-og-width\":`1913`,width:`1913`,\"data-og-height\":`891`,height:`891`,\"data-path\":`images/connectors/stitch/03-connectors-list.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=2c172c04bf83f207edd49ecac028e697 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=b1d8455f2e2893ca755881390cd41563 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=82fb4a17f3efff4ec4e87e64a8f59e56 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=c93920055a90b84df52849265cbe956b 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=f723336975a52808c6bb328ec6f7cd18 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/03-connectors-list.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=a44f2ec388ce0fee89c42b189f12dc1c 2500w`})})]}),_jsxs(Step,{title:`Search for Stitch and press Connect`,children:[_jsxs(_components.p,{children:[`Type `,_jsx(_components.code,{children:`Stitch`}),` into `,_jsx(_components.strong,{children:`Search for integrations`}),`, then press `,_jsx(_components.strong,{children:`Connect`}),` on the row.`]}),_jsx(Frame,{caption:`The Stitch row, described as AI UI design, Screens, Design DNA.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=df73d33fff989de21ad13dce9bf27ab2`,alt:`The Connectors panel filtered to Stitch with a Connect button.`,\"data-og-width\":`1918`,width:`1918`,\"data-og-height\":`878`,height:`878`,\"data-path\":`images/connectors/stitch/04-search.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=17c7600076da920bb0e1f92f88289b2e 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=4696d07c4c704b10f9c99e6f22245b85 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=4a8e7154931ae9bcf197db315e7b0be1 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=a5359735338312f2c5768a69ad7cc2c7 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=d3ee847101c5086b7a573d9e0ddd94a6 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/04-search.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=0d48badf1c62087ce046aa9a50a22b82 2500w`})})]}),_jsxs(Step,{title:`The Stitch panel asks for a key`,children:[_jsx(_components.p,{children:`Instead of a popup, WPOS opens the Stitch panel with a single field for your API\nkey, plus the feature list, notes, and the nine tools it exposes.`}),_jsx(_components.p,{children:`Leave it open and create the key next.`}),_jsx(Frame,{caption:`The Stitch panel, with the key field above its feature list.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=66bced052d99d5e5347ff34ba2cc0d60`,alt:`The WPOS Stitch panel showing a key field, key features, notes, and a tools count of nine.`,\"data-og-width\":`1916`,width:`1916`,\"data-og-height\":`891`,height:`891`,\"data-path\":`images/connectors/stitch/05-stitch-panel.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=d415062697bff4e9d35eea3b7ba51634 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=cfb12d02952359987c85bcf505a07a53 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=5a4b1b152363e4974b394bc482adcca4 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=55f2ce2cf21c42cbd81aa8996130505b 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=6e119247a20f1a75a6704bc8c4ab911c 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/05-stitch-panel.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=2d95424e72d0e34cf2ad24dcb2707b9d 2500w`})})]}),_jsxs(Step,{title:`Create an API key in Stitch`,children:[_jsxs(_components.p,{children:[`In `,_jsx(_components.a,{href:`https://stitch.withgoogle.com`,children:`stitch.withgoogle.com`}),`, open your profile\npicture, then `,_jsx(_components.strong,{children:`Stitch settings`}),`, then `,_jsx(_components.strong,{children:`API key`}),`. Click `,_jsx(_components.strong,{children:`Create key`}),`.`]}),_jsx(Note,{children:_jsx(_components.p,{children:`Stitch runs abuse auto-detection: any key it finds publicly exposed is\ndisabled automatically. That protects you, but it also means a key pasted\ninto a public repo or a shared screenshot stops working without notice.`})}),_jsx(Frame,{caption:`The Stitch API key page before any key exists.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=dd7361eb8f8a6d581d5f0c2b3989f9bb`,alt:`The Stitch API key page showing no keys to display, with a Create key button and an abuse auto-detection notice.`,\"data-og-width\":`1902`,width:`1902`,\"data-og-height\":`886`,height:`886`,\"data-path\":`images/connectors/stitch/06-stitch-api-page.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=77a6f67302eff4ccb2682de6c9eee800 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=2120c484ac0dd92ac35e1455f0c56db1 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=5da2bcfb4f73f51b23df159bfe6f9607 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=d933da91b1a0b77e25457476986f71ac 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=fde23d842f292fb2f044bd642757e311 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/06-stitch-api-page.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=3512156174021818e9f1162a2d6438e6 2500w`})})]}),_jsxs(Step,{title:`Copy the key`,children:[_jsx(_components.p,{children:`The new key appears in the table with its creation date and last used time.`}),_jsx(Tip,{children:_jsx(_components.p,{children:`Stitch only ever displays the last few characters of a key, so this page\ncannot leak the full value later. Copy it when it is first shown. If you\nlose it, delete the key and create another.`})}),_jsx(Frame,{caption:`The key, listed with only its final characters visible.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=ed564fe6427291477660062767ec5904`,alt:`The Stitch API key table showing one key with a truncated value, a creation date, and a delete icon.`,\"data-og-width\":`1908`,width:`1908`,\"data-og-height\":`885`,height:`885`,\"data-path\":`images/connectors/stitch/07-key-created.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=f119ba9ef0f1daf011ff38d47c576dff 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=bd989c4ebe6280cb69bd2ab1759c8ead 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=44a15b6685e61c9b8a163e975b47ef15 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=2cb451d98e743bc202820062b6b93ee6 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=e6c5253d849f32f00d453a79bc1a36e6 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/07-key-created.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=b15ed89f86f6ba9715216a00e7561990 2500w`})})]}),_jsxs(Step,{title:`Paste it into WPOS and connect`,children:[_jsxs(_components.p,{children:[`Back in the Stitch panel, paste the key into the field, where it masks as you\npaste, and click `,_jsx(_components.strong,{children:`Connect`}),`.`]}),_jsxs(_components.p,{children:[`The row then reads `,_jsx(_components.strong,{children:`Connected`}),` with `,_jsx(_components.strong,{children:`View Details`}),`, and Stitch’s nine tools\nbecome available to the agent.`]}),_jsx(Note,{children:_jsxs(_components.p,{children:[`Like Figma and Jotform, Stitch keeps `,_jsx(_components.strong,{children:`Disconnect`}),` inside the detail panel.\nClick `,_jsx(_components.strong,{children:`View Details`}),` to reach it. The row itself has no Disconnect button.`]})}),_jsx(Frame,{caption:`Connected. Disconnect lives behind View Details.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=28c7318bd7e9b278c534e90dce18fb23`,alt:`The Stitch row showing Connected with a View Details button.`,\"data-og-width\":`1913`,width:`1913`,\"data-og-height\":`892`,height:`892`,\"data-path\":`images/connectors/stitch/08-connected.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?w=280\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=e971aab624dce17fc24605654a362683 280w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?w=560\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=00c49f2784017c37c26a771c8c0497be 560w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?w=840\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=9c6a9f9bcc0e47ea249c1358f153a6d6 840w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?w=1100\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=1cef1e0295f22df594cf105a777ff07d 1100w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?w=1650\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=d06a285d3a1c671610cb3c1c725bcda0 1650w, https://mintcdn.com/wpos/CKANOPF-4yzpKeQV/images/connectors/stitch/08-connected.png?w=2500\u0026fit=max\u0026auto=format\u0026n=CKANOPF-4yzpKeQV\u0026q=85\u0026s=aeb9edd8a7d3235830d3cc1c3d7bd3ab 2500w`})})]})]}),`\n`,_jsx(Heading,{level:`2`,id:`tools`,children:`Tools`}),`\n`,_jsxs(Table,{children:[_jsx(_components.thead,{children:_jsxs(_components.tr,{children:[_jsx(_components.th,{children:`Tool`}),_jsx(_components.th,{children:`What it does`})]})}),_jsxs(_components.tbody,{children:[_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`list_projects`})}),_jsx(_components.td,{children:`List all your available Stitch projects`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`get_project`})}),_jsx(_components.td,{children:`Retrieve details of a specific project`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`create_project`})}),_jsx(_components.td,{children:`Create a new Stitch project`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`list_screens`})}),_jsx(_components.td,{children:`List all screens within a project`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`get_screen`})}),_jsx(_components.td,{children:`Get metadata for a specific screen`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`generate_screen_from_text`})}),_jsx(_components.td,{children:`Generate a new screen from a text prompt and design context`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`fetch_screen_code`})}),_jsx(_components.td,{children:`Download the frontend code of a screen`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`fetch_screen_image`})}),_jsx(_components.td,{children:`Download the high resolution screenshot of a screen`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.code,{children:`extract_design_context`})}),_jsx(_components.td,{children:`Scan a screen to extract its Design DNA: fonts, colors, layouts`})]})]})]}),`\n`,_jsx(Heading,{level:`2`,id:`disconnect`,children:`Disconnect`}),`\n`,_jsxs(_components.p,{children:[`Press `,_jsx(_components.strong,{children:`View Details`}),` on the row, then `,_jsx(_components.strong,{children:`Disconnect`}),` inside the panel. The\nstored key is removed from WordPress. Your Stitch projects and screens are\nuntouched.`]}),`\n`,_jsxs(_components.p,{children:[`To invalidate the key entirely, also delete it in Stitch under `,_jsx(_components.strong,{children:`Stitch\nsettings`}),`, then `,_jsx(_components.strong,{children:`API key`}),`, using the delete icon on the row. Disconnecting in\nWPOS does not revoke it on Google’s side.`]}),`\n`,_jsx(Heading,{level:`2`,id:`troubleshooting`,children:`Troubleshooting`}),`\n`,_jsxs(AccordionGroup,{children:[_jsx(Accordion,{title:`The key was accepted but stopped working later`,id:`the-key-was-accepted-but-stopped-working-later`,children:_jsx(_components.p,{children:`Stitch disables keys it detects as publicly exposed. If the key was ever pasted\ninto a public repo, a ticket, or a shared screenshot, assume it was caught.\nCreate a new key and reconnect.`})}),_jsx(Accordion,{title:`The key was lost before it was saved`,id:`the-key-was-lost-before-it-was-saved`,children:_jsx(_components.p,{children:`Stitch shows only the last few characters after creation, so there is nothing\nto recover. Delete the key and create another.`})}),_jsx(Accordion,{title:`No projects are returned`,id:`no-projects-are-returned`,children:_jsx(_components.p,{children:`The account behind the key has no Stitch projects yet. Create one at\nstitch.withgoogle.com first, then ask again.`})}),_jsx(Accordion,{title:`The row has no Disconnect button`,id:`the-row-has-no-disconnect-button`,children:_jsxs(_components.p,{children:[`Correct behaviour. Stitch, Figma, and Jotform all keep Disconnect inside the\ndetail panel. Click `,_jsx(_components.strong,{children:`View Details`}),` to reach it.`]})}),_jsx(Accordion,{title:`Tools changed without an update to WPOS`,id:`tools-changed-without-an-update-to-wpos`,children:_jsx(_components.p,{children:`Expected. Stitch runs on Google’s hosted MCP server, so the tool set follows\nwhat Google ships rather than the WPOS release cycle. Stitch is in beta, so\nthis happens more often than with other connectors.`})})]}),`\n`,_jsxs(_components.p,{children:[`For issues shared across every connector, see\n`,_jsx(_components.a,{href:`/connect/connectors`,children:`Introducing Connectors`}),`.`]}),`\n`,_jsx(Heading,{level:`2`,id:`related`,children:`Related`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.a,{href:`/connectors/figma`,children:`Figma`}),`, for reading designs you have already built`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.a,{href:`/connectors/canva`,children:`Canva`}),`, for finished artwork rather than UI screens`]}),`\n`]})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{YouTubeVideo,default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Stitch","icon":"table-cells-large","description":"Stitch is Google's AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.","href":"/connectors/stitch"}}},"mdxSourceWithNoJs":null,"noJsSplices":[[148,1181,")=>null;function _cr"]]},"mdxExtracts":{"tableOfContents":[{"title":"What you can do","slug":"what-you-can-do","depth":2,"children":[]},{"title":"Example requests","slug":"example-requests","depth":2,"children":[]},{"title":"Before you connect","slug":"before-you-connect","depth":2,"children":[]},{"title":"Connect it","slug":"connect-it","depth":2,"children":[]},{"title":"Tools","slug":"tools","depth":2,"children":[]},{"title":"Disconnect","slug":"disconnect","depth":2,"children":[]},{"title":"Troubleshooting","slug":"troubleshooting","depth":2,"children":[]},{"title":"Related","slug":"related","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"wpos","siteName":"WPOS","title":"Stitch - WPOS","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-09-19T13:28:35.177Z","originalFileLocation":"connectors/stitch.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Stitch is Google\u0026#x27;s AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.\">\u003cmeta data-mint-head name=\"application-name\" content=\"WPOS\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Stitch - WPOS\">\u003cmeta data-mint-head property=\"og:description\" content=\"Stitch is Google\u0026#x27;s AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"WPOS Docs\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://docs.wpos.ai/connectors/stitch\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://wpos.mintlify.site/_mintlify/api/og/v2?division=Design+and+forms\u0026amp;title=Stitch\u0026amp;description=Stitch+is+Google%27s+AI+UI+design+tool.+Connect+it+to+WPOS+and+the+agent+can+use+it+as+part+of+the+work+it+does+on+your+site.\u0026amp;theme=55288e348236731eda98c51c\u0026amp;signature=fe00e60298e0fbe7251e333fd1bfb3cdcc33652e3a1885e0e5bd0d7d0d396b1a\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Stitch - WPOS\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Stitch is Google\u0026#x27;s AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://wpos.mintlify.site/_mintlify/api/og/v2?division=Design+and+forms\u0026amp;title=Stitch\u0026amp;description=Stitch+is+Google%27s+AI+UI+design+tool.+Connect+it+to+WPOS+and+the+agent+can+use+it+as+part+of+the+work+it+does+on+your+site.\u0026amp;theme=55288e348236731eda98c51c\u0026amp;signature=fe00e60298e0fbe7251e333fd1bfb3cdcc33652e3a1885e0e5bd0d7d0d396b1a\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/mintlify-assets/_mintlify/favicons/wpos/p4lnAUWxZyTXLe9X/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"WPOS\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#062565\">\u003clink data-mint-head rel=\"canonical\" href=\"https://docs.wpos.ai/connectors/stitch\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/connectors/stitch.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://docs.wpos.ai/#organization\",\"name\":\"WPOS\",\"url\":\"https://docs.wpos.ai\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/wpos/r3ng18J_nwt1_fD2/logo/light.svg?fit=max\u0026auto=format\u0026n=r3ng18J_nwt1_fD2\u0026q=85\u0026s=67939bfd870e9c049cc8758c0d204b2b\"}},{\"@type\":\"WebSite\",\"@id\":\"https://docs.wpos.ai#website\",\"name\":\"WPOS\",\"url\":\"https://docs.wpos.ai\",\"publisher\":{\"@id\":\"https://docs.wpos.ai/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://docs.wpos.ai/connectors/stitch#webpage\",\"url\":\"https://docs.wpos.ai/connectors/stitch\",\"name\":\"Stitch\",\"description\":\"Stitch is Google's AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.\",\"dateModified\":\"2026-09-19T13:28:35.177Z\",\"isPartOf\":{\"@id\":\"https://docs.wpos.ai#website\"},\"breadcrumb\":{\"@id\":\"https://docs.wpos.ai/connectors/stitch#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://docs.wpos.ai/connectors/stitch#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Design and forms\",\"item\":\"https://docs.wpos.ai/connectors/figma\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Stitch\",\"item\":\"https://docs.wpos.ai/connectors/stitch\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://docs.wpos.ai/connectors/stitch#article\",\"headline\":\"Stitch\",\"name\":\"Stitch\",\"description\":\"Stitch is Google's AI UI design tool. Connect it to WPOS and the agent can use it as part of the work it does on your site.\",\"url\":\"https://docs.wpos.ai/connectors/stitch\",\"mainEntityOfPage\":{\"@id\":\"https://docs.wpos.ai/connectors/stitch#webpage\"},\"dateModified\":\"2026-09-19T13:28:35.177Z\",\"publisher\":{\"@id\":\"https://docs.wpos.ai/#organization\"},\"isPartOf\":{\"@id\":\"https://docs.wpos.ai#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"WPOS\",\"publisher\":{\"@type\":\"Organization\",\"name\":\"WPOS\"},\"provider\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","agentPointerHref":"/connectors/stitch.md","siteName":"WPOS","nav":{"global":null,"tabs":[{"tab":"Introduction","pages":[{"title":"Introduction","href":""}]},{"tab":"Partners","pages":[{"title":"Partners","href":"/partners/overview"}]},{"tab":"Connectors","groups":[{"group":"About","pages":[{"title":"Introducing Connectors","icon":"plug","href":"/connect/connectors"}]},{"group":"CRM and sales","pages":[{"title":"HubSpot","icon":"hubspot","href":"/connectors/hubspot"},{"title":"Intercom","icon":"intercom","href":"/connectors/intercom"}]},{"group":"Marketing","pages":[{"title":"Mailchimp","icon":"mailchimp","href":"/connectors/mailchimp"}]},{"group":"Payments","pages":[{"title":"Stripe","icon":"stripe","href":"/connectors/stripe"},{"title":"PayPal","icon":"paypal","href":"/connectors/paypal"}]},{"group":"E-commerce","pages":[{"title":"WooCommerce","icon":"cart-shopping","href":"/connectors/woocommerce"}]},{"group":"Analytics and SEO","pages":[{"title":"Google Analytics","icon":"chart-line","href":"/connectors/google-analytics"},{"title":"Google Search Console","icon":"magnifying-glass-chart","href":"/connectors/google-search-console"}]},{"group":"Productivity and documents","pages":[{"title":"Google Drive","icon":"google-drive","href":"/connectors/google-drive"},{"title":"Google Sheets","icon":"table","href":"/connectors/google-sheets"},{"title":"Google Docs","icon":"file-lines","href":"/connectors/google-docs"},{"title":"Notion","icon":"note-sticky","href":"/connectors/notion"}]},{"group":"Scheduling","pages":[{"title":"Calendly","icon":"calendar","href":"/connectors/calendly"},{"title":"Google Calendar","icon":"calendar-days","href":"/connectors/google-calendar"}]},{"group":"Design and forms","pages":[{"title":"Figma","icon":"figma","href":"/connectors/figma"},{"title":"Jotform","icon":"wpforms","href":"/connectors/jotform"},{"title":"Canva","icon":"palette","description":"Canva is a drag-and-drop design suite. Connect it to WPOS and the agent can use it as part of the work it does on your site.","href":"/connectors/canva"},{"title":"Stitch","icon":"table-cells-large","href":"/connectors/stitch"}]},{"group":"Messaging","pages":[{"title":"Slack","icon":"slack","description":"Slack is a channel-based messaging platform. Connect it to WPOS and the agent can use it as part of the work it does on your site.","href":"/connectors/slack"}]}]},{"tab":"Elementor Ultra","pages":[{"title":"Elementor Ultra","href":"/ultra/overview"}]}]},"basePath":"","title":"Stitch - WPOS","buildId":"dpl_5tKr6cUUeuVJdEZ9JAEY3h4soMJ8","deploymentId":"dpl_5tKr6cUUeuVJdEZ9JAEY3h4soMJ8","dynamics":["07c022d89b","a74be98ba7"],"chunks":["Frame-B90Qhg8r.js","DynamicMarkdown-DpAS3GCb.js","zoom-image-lightbox-9bQKnClW.js","lightbox-handle-r17bVUz3.js"]}
