MCP field guide

What Is WebMCP?

A practical guide to the proposed web standard that lets websites expose structured tools AI agents can call directly in the page — and how it relates to the Model Context Protocol.

Reviewed August 26, 20269 minute readBased on the WebMCP explainer and Chrome documentation

The short answer

WebMCP lets a web page declare what agents can do on it, as callable tools.

WebMCP is a proposed web standard that lets a website expose structured tools — JavaScript functions or annotated HTML forms — that AI agents can discover and invoke directly in the page. Instead of an agent reading your DOM and guessing what each button does, the page states its capabilities explicitly, with names, descriptions, and JSON Schemas.

A page that registers WebMCP tools behaves like an in-page MCP server: it implements tools that expose client-side logic and DOM interaction rather than a backend API. The user and the agent share the same live page and the same signed-in session, and tool executions are visible on screen.

Reliable agent actuation

One well-defined tool call replaces a fragile multi-step sequence of DOM reads, guesses, and clicks.

Progressive enhancement

Your human-facing UI stays exactly as designed. WebMCP adds an agent-readable layer on top of existing logic.

Nothing for users to install

Tools ship with the website. Any agentic browser that implements the standard can use them on a normal visit.

Motivation

From scraping the DOM to calling a tool

Agentic browsers can already operate websites by reading markup and simulating clicks. It works, but every step is open to interpretation — and every redesign breaks the flow.

Without WebMCP

The agent scrapes the DOM, infers what each element is for, fills fields one by one, and hopes the page behaves as expected after every interaction.

  • Many steps, each one a chance to misread the UI
  • Breaks when layout, markup, or copy changes
  • Slow: the agent re-reads the page after every action

With WebMCP

The page registers tools like checkout or filter_results with typed inputs. The agent calls the tool; the page’s own logic does the work, visibly.

  • One call with schema-validated arguments
  • Survives redesigns — the contract is the tool, not the markup
  • Executes in the page, so the user sees and trusts what happened

The two APIs

Declarative forms and imperative JavaScript

WebMCP gives you two ways to expose tools. They can be mixed on the same page.

Declarative API

HTML attributes

Annotate a standard HTML form with toolname and tooldescription, and describe each field with toolparamdescription. The browser synthesizes a tool definition — including the JSON Schema — from the form itself. Add toolautosubmit to let the agent submit after filling.

Imperative API

document.modelContext

Register any JavaScript function as a tool with document.modelContext.registerTool(), passing a name, description, JSON Schema, and an async execute callback. This covers everything forms cannot express: navigation, state management, canvas interactions, and multi-step client logic. Agents discover tools with getTools() and run them through browser-mediated executeTool().

Terminology

WebMCP vs. MCP: what’s the difference?

WebMCP builds on the Model Context Protocol’s tool concepts — names, descriptions, JSON Schemas — but moves them into the browser page. They solve different halves of the same problem and work well together.

MCP serverWebMCP
Where tools runIn a separate server process — local (stdio) or remote (Streamable HTTP)Inside the web page itself, in the page’s JavaScript context
Who hosts themA developer runs or deploys a server and users configure their client to connectThe website ships them — nothing for the user to install or configure
What they exposeBackend capabilities: APIs, databases, files, external servicesClient-side capabilities: forms, page state, in-app actions, the signed-in session
Session and contextThe server manages its own auth and state, separate from any browser sessionShares the live page and the user’s existing signed-in session with the agent
DiscoveryClient connects to a configured endpoint and lists tools over the protocolThe browser mediates: agents discover tools when the user visits the page
StatusStable open protocol with versioned specifications and broad client supportExperimental proposed web standard — Chrome origin trial, API may change

Rule of thumb: use an MCP server when the capability lives in a backend — an API, a database, a filesystem. Use WebMCP when the capability lives in a web page a person is already using — a form, a booking flow, an in-app action that benefits from the user’s live session and confirmation. Many products will end up shipping both.

In practice

A real WebMCP example

Our own server-submission form on this site is a WebMCP tool. The declarative version takes three attributes on an existing form:

Declarative — annotate an existing formHTML
<form
  toolname="submit_mcp_server"
  tooldescription="Submit a new MCP server to the directory for review"
  toolautosubmit
>
  <input
    name="github_url"
    toolparamdescription="GitHub repository URL of the MCP server"
    required
  />
  <button type="submit">Submit</button>
</form>
Imperative — register a tool from JavaScriptJavaScript
await document.modelContext.registerTool({
  name: "submit_mcp_server",
  description: "Submit a new MCP server to the directory for review",
  inputSchema: {
    type: "object",
    properties: {
      github_url: {
        type: "string",
        description: "GitHub repository URL of the MCP server",
      },
    },
    required: ["github_url"],
  },
  async execute({ github_url }) {
    const result = await submitServer(github_url)
    return { content: [{ type: "text", text: result.message }] }
  },
})

Try it live: open our submit page in a WebMCP-enabled browser and the submit_mcp_server tool appears in the agent’s tool list.

Availability

Where WebMCP works today

WebMCP is experimental and rolling out through origin trials, browser flags, and agent products.

Chrome origin trial

Available from Chrome 149 through the WebMCP origin trial, so production sites can register tools for real users.

Chrome flag for local development

Enable chrome://flags/#enable-webmcp-testing and relaunch to develop and test tools locally.

ChatGPT desktop app

The ChatGPT desktop app’s built-in browser and ChatGPT Sites support WebMCP tools, letting ChatGPT and Codex use them to complete tasks.

Tool Inspector extension

The Model Context Tool Inspector extension shows registered tools on any page, lets you call them manually, and validates your JSON Schemas.

The standard is incubated in the W3C Web Machine Learning Community Group. The stated goal is an API any browser with agentic capabilities can implement — not a Chrome-only feature.

Use cases

What WebMCP tools are good for

The common thread: tasks where a human and an agent collaborate on the same live page.

Structured form filling

A submit_application or checkout tool maps conversation data to the right fields — no guessing whether a field wants a full name or first and last name.

Human-first widgets, agent-usable

Complex date pickers, seat selectors, and drag-to-configure interfaces stay beautiful for humans while exposing a clean tool interface for agents.

Support and troubleshooting flows

A run_diagnostics or find_support_form tool lets an agent skip nested menus and jump straight to the fix, using information the user already provided.

Complex multi-step booking

Multi-city travel, multi-passenger reservations, and other flows that take humans many clicks collapse into a few reliable tool calls.

Security

The browser mediates every tool call

WebMCP is designed for local, human-in-the-loop browsing — not headless automation. Several mechanisms keep tool execution controlled.

Built-in safeguards

  • Origin isolation: WebMCP only works in origin-isolated documents, so a tool’s origin stays stable for its whole lifetime.
  • Permissions policy: the tools policy defaults to self — cross-origin iframes cannot register tools unless the embedder grants allow="tools".
  • Visible execution: tools run in the page the user is looking at, so actions are observable rather than hidden in a backend.
  • User confirmation: sensitive tools such as purchases can require an explicit confirmation dialog before executing.
  • Secure origins only: cross-origin tool discovery is limited to explicitly listed, secure origins.
  • Abortable calls: executions receive an AbortSignal, so in-flight work can be cancelled cleanly.
Treat tool inputs as untrusted, exactly like form input. An agent fills your tool arguments from a conversation you do not control — validate on the client and again on your backend.

Frequently asked questions

WebMCP FAQ

What is WebMCP?

WebMCP is a proposed web standard that lets a website expose structured tools — JavaScript functions or annotated HTML forms — that AI agents can discover and call directly in the page. Instead of an agent interpreting your UI element by element, the page declares exactly what actions are available and how to use them.

Is WebMCP the same as MCP?

No, but they are closely related. MCP (Model Context Protocol) connects AI applications to external servers over stdio or HTTP. WebMCP applies the same tool concepts inside the browser: the web page itself acts as an in-page tool provider, exposing client-side logic and DOM interaction rather than a backend API. A page with WebMCP tools can be thought of as an in-page MCP server.

Which browsers support WebMCP?

Chrome runs a WebMCP origin trial starting in Chrome 149, and it is available behind the chrome://flags/#enable-webmcp-testing flag for local development. The ChatGPT desktop app’s built-in browser also supports WebMCP tools. The standard is incubated in the W3C Web Machine Learning Community Group, with the goal that any agentic browser can implement it.

Do I need a backend server to use WebMCP?

No. WebMCP is entirely client-side. Tools are registered from the page’s own JavaScript with document.modelContext.registerTool(), or synthesized automatically from HTML forms annotated with toolname and tooldescription attributes. Your existing application logic handles the actual work.

How do I try WebMCP today?

Enable chrome://flags/#enable-webmcp-testing in Chrome, relaunch, and open a page that registers tools. Install the Model Context Tool Inspector extension to see registered tools, call them manually, and chat with an agent that invokes them. For production traffic, join the Chrome origin trial from Chrome 149.

What is the WebMCP Challenge?

The WebMCP Challenge is a hackathon run by OpenAI with Google Chrome, Cloudflare, Shopify, Vercel, Render, and Netlify (August 25 – September 3, 2026). Participants build agent-native web apps using WebMCP, and the top 10 submissions each win $3,000 plus additional prizes.

Is WebMCP a finished standard?

Not yet. WebMCP is an experimental proposal under active discussion in the W3C Web Machine Learning Community Group, with an origin trial in Chrome. API details can still change, so treat it as a progressive enhancement rather than a hard dependency.

How is WebMCP different from browser automation?

Browser automation has an agent actuate your UI from the outside — reading the DOM, guessing what buttons do, and clicking through multi-step flows. WebMCP inverts this: the page declares its capabilities as typed tools with JSON Schemas, so the agent calls one well-defined function instead of interpreting pixels and markup. It is faster, more reliable, and keeps your human-facing design intact.

Official WebMCP references

WebMCP is under active discussion and subject to change. Use the explainer and specification draft for implementation details and the latest API shape.