WebMCP theme lab
This site speaks WebMCP — a
proposed web standard that lets a page hand real tools to the AI agent in your
browser instead of making it guess at buttons. Here it exposes three tools
(set-page-theme, get-page-theme, reset-page-theme) that let an agent
restyle the site for you. Your theme is saved in your browser’s localStorage,
so the site keeps looking that way for you on every visit. Nobody else sees
it, and nothing is sent anywhere.
The idea: open the agent in your browser and ask
Re-theme this site like a 90s CS professor’s homepage.
The agent finds the set-page-theme tool, applies the built-in
90s-cs-professor preset — Times New Roman, silver-gray background, blue
underlined links, groove borders, a “best viewed with any browser” footer —
and the look sticks until you ask for something else. You’re not limited to
the preset: ask for “a synthwave theme” or “solarized with a serif font” and
the agent composes one from the site’s CSS variables plus its own CSS.
Getting the API turned on
WebMCP is experimental, so whether the tools are live depends on your browser, the origin, and which agent is consuming them:
- Real visitors (Chrome 149–156): the page-facing API
(
document.modelContext) is enabled per-site through the WebMCP origin trial. This site serves its token onestaab.dev; staging previews run on different origins and need their own token, so the API is usually absent there. - Local testing:
chrome://flags/#enable-webmcp-testingenables the testing surface (navigator.modelContextTesting). This page registers its tools there too, so you can inspect and invoke them with the WebMCP DevTools panel or the Model Context Tool Inspector extension — including test calls driven by Gemini. - Gemini in Chrome: Google has said Gemini in Chrome will be the first consumer of native WebMCP tools, and its rollout is still in progress. If the status box below shows the tools registered but Gemini ignores them, your Chrome channel’s Gemini simply isn’t wired to WebMCP yet — try the DevTools panel or Inspector extension in the meantime.
The box below shows live what this browser exposes on this origin:
Checking for a Web Model Context API…
The buttons above call the same code the agent tools would, so the demo works even with no agent at all.