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.
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.
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.
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.
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.
