Skip to content
New Tracks the WebMCP draft of 2026-11-02

Make your site
agent-ready

In our benchmark, agents used up to 62× fewer tokens with WebMCP (best case: Notion, GPT-6 Luna). See what agents get from your site, then fix it with one line.

Not running a site, just using agents? Set up your agent

8,500+ sites already speak WebMCP

Click any of them to scan it live.

Count: live sites in the webmcp.com directory (2026-11-05). The stricter Known Good index saw 541 sites register tools when it ran their pages (2026-11-04). Logos checked with the scanner on 2026-11-07; they belong to their owners, no affiliation.

What is WebMCP?

WebMCP is becoming the web’s standard for AI agents. We’re all in

Engineers from Google and Microsoft are drafting it at the W3C, the body behind the web’s standards, and Chrome and Edge are already testing it. Today Claude Code, Codex and every other agent use your site like a screenshot: they look, guess which button to press and try again. Slow, costly, easy to break. With WebMCP your site tells agents exactly what they can do, like search, read or add to cart, and they just ask. We believe every site will speak it, so we built webmcpx to let yours do it today.

Sources Online-Mind2Web: agents fail about 4 in 10 live tasks A page snapshot costs 12k to 77k tokens WindTunnel: tools vs clicking, timed WebMCP draft, W3C Web Machine Learning CG (editors from Google and Microsoft) Implementation status (Chrome and Edge origin trials) Chrome: WebMCP origin trial Chrome Platform Status Microsoft Edge: WebMCP origin trial Microsoft Edge explainer Our benchmark method

  1. Your page registers tools

    A name, a description, an input schema and a function: the actions your buttons already run.

  2. The browser lists them

    An agent asks the browser what the page can do, with typed inputs and hints such as read-only.

  3. The agent calls them

    In the user’s own tab, with their session: no new server and no OAuth.

page.js 
document.modelContext.registerTool({
  name: "search_products",
  description: "Search the catalog by keyword.",
  inputSchema: { type: "object", properties: { query: { type: "string" } } },
  annotations: { readOnlyHint: true },
  async execute({ query }) {
    // Expected failures are answers, never rejections: hosts drop rejection reasons.
    try { return JSON.stringify(await searchCatalog(query)); }
    catch { return JSON.stringify({ error: "Catalog unavailable, try again shortly." }); }
  }
});
webmcpx

An independent, open-source community project, not affiliated with the W3C or any browser maker. We build webmcpx so WebMCP pays off today: sites get good tools without writing them, agents get the same answers for fewer tokens, and every number we publish can be rerun.

Start with webmcpx today, on your site and in your agent

Everything that keeps WebMCP off most sites today, solved: one line on your site, one command in your agent, and nothing else to worry about.

WebMCP by hand compared with webmcpx
Browser supportWebMCP by hand:Chrome and Edge only, behind a flag or an origin trial. Firefox and Safari: nothing yet. With webmcpx:The official W3C polyfill wherever WebMCP is missing: your tools are there today in Chrome, Firefox and Safari.
Tools on every pageWebMCP by hand:You design and write each one, page by page. With webmcpx:Search, read and page context on every page from one script tag. No code.
Your own actionsWebMCP by hand:Schemas, annotations and error handling, written by hand for each one. With webmcpx:One tool() call, a hook for React, Vue or Svelte, or the forms you already have.
Reaching Claude Code, Codex, CursorWebMCP by hand:Build your own bridge, or wait for each agent to support it. With webmcpx:npx webmcpx mcp: each page’s tools, plus the standard ones on any site, even without webmcpx.
Spec changesWebMCP by hand:Follow every change to the draft and rewrite your tools. With webmcpx:We track the W3C draft and move with it: you update one package.
Getting it rightWebMCP by hand:Result shapes, error codes, output budgets, paging, annotations: all yours to get right. With webmcpx:Right by default: one result shape, error codes agents can act on, output budgets, paging and correct annotations.
Safe for agentsWebMCP by hand:Hidden instructions and invisible characters in tool descriptions or page text: easy to miss, easy to exploit. With webmcpx:Standard tools only read, hidden text stays out, invisible characters are stripped, and the linter flags hidden instructions in your tools.
Testing itWebMCP by hand:Turn on a Chrome flag, open DevTools and hope. With webmcpx:npx webmcpx tools localhost:3000 lists your tools in any browser, no flag; the scanner checks any live URL.
Proof it pays offWebMCP by hand:Your guess. With webmcpx:A public benchmark of WebMCP vs reading the page: up to 62× fewer tokens for the same answers (best case: Notion, GPT-6 Luna). Rerun it with one command.
CostWebMCP by hand:Your time, on every page and every change. With webmcpx:Free and open source (MIT), about 2.7 KB on load, no account, no server.
Add it to your site Add it to your agent

Leaderboard

How much WebMCP saves, model by model

One agent reads, clicks and fills using page snapshots; the other calls the site's WebMCP tools. Pick a model; biggest savings first.

Ranked by success with WebMCP, then by cost per run.

Selected cases: 19 of 30 questions, where WebMCP used at most half the tokens. All results are public, or run it yourself with just bench.

GPT-6 Luna (OpenAI)

Notion

“I'm writing long paragraphs into a Notion page through the API. What's the maximum number of characters a single rich text object's text content can have in a request?”

developers.notion.com (opens Notion)

62×

fewer tokens

65k → 1.0k tokens

Tokens per question, tokens per run; lower is better. Success rate per arm.
QuestionWithout WebMCP: tokensWith WebMCP: tokensWithout WebMCP: solvedWith WebMCP: solved
Notion: I'm writing long paragraphs into a Notion page through the API. What's the maximum number of characters a single rich text object's text content can have in a request?65k1.0k100%100%
Notion: I'm paginating through results from the Notion API. What's the largest page_size I can request per call on the list endpoints?54k1.1k100%100%
Notion: How many requests per minute does the Notion API allow per connection on plans other than Business and Enterprise?39k1.1k100%100%
Notion: When my Notion integration sends too many requests, what error code string does the API put in the error response body?21k1.0k100%100%

For your agent

Your agent reads every page the expensive way. Give it the page’s tools instead: on the sites we measured, the same answers for a fraction of the tokens. Works on any site, and it is the one MCP every Claude Code and Codex setup should have.

Up to 62× fewer tokens

Best case: Notion, GPT-6 Luna

Same answers. 2.7× to 6.0× fewer tokens across 6 models on the leaderboard.

Whole runs: on 1–6 of 30 questions per model, WebMCP used more tokens.

Works with any agent and browser

  • Claude Code
  • Codex
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Gemini CLI
  • Zed
  • JetBrains
  • Cline
  • Chrome
  • Firefox
  • Safari
  • Brave
  • Arc
  • Opera
  • Vivaldi
  • Playwright
  • Selenium
  • Puppeteer
  • Cypress
  • WebdriverIO
prompt 
Use WebMCP first on every web page you work with, before reading or clicking anything: in your own browser and in any script you write or run (Playwright, Selenium, Puppeteer, browser-use, CDP), even if you support WebMCP natively. Set it up with webmcpx (read https://webmcpx.dev/llms.txt) and add this rule to your agent instructions (AGENTS.md, CLAUDE.md or equivalent) so it applies to every future task. Then prove it works: open https://webmcpx.dev, list its WebMCP tools and call one.

One prompt: your agent sets itself up, uses WebMCP first everywhere, and proves it on webmcpx.dev.

For your site

AI agents are already reading your pages. Give them real tools in two steps: ask your coding agent (Claude Code, Codex, Cursor), or do it by hand.

Standard tools: one line

Search, read and page context on every page. No code.

~2.7 KB on load · Rust + WebAssembly · MIT license

prompt 
Add WebMCP to this site with webmcpx: run `npx skills add webmcpx/webmcpx -y`, follow the skill, then check the tools with `npx webmcpx tools <local URL>`.
index.html 
<script type="module" src="https://cdn.jsdelivr.net/npm/webmcpx@0.2/dist/auto.js"></script>

Paste it before </body>. In browsers without WebMCP, it adds the W3C polyfill.

app.js 
// npm i webmcpx
import "webmcpx/polyfill"; // WebMCP where the browser lacks it
import { register } from "webmcpx";

register(); // the standard tools; tool() adds your own

Your site’s own actions

Add to cart, book, search your catalog: the functions your buttons already call, as tools agents call directly.

prompt 
Read https://webmcpx.dev/llms.txt, then look at this project and suggest the WebMCP tools an AI agent would find useful here. Ask me which to add, then add them with webmcpx.

Your agent reads what webmcpx does, finds the actions worth exposing in your project, asks you which ones to add, then adds and checks them.

Cart.jsx 
import { useTool } from "webmcpx/react";

function Cart({ cart }) {
  useTool({
    name: "add_to_cart",
    description: "Add a product to the cart by SKU.",
    input: { sku: "string", "qty?": "integer" },
    acts: true,
    run: ({ sku, qty = 1 }) => cart.add(sku, qty),
  });
  return <CartView cart={cart} />;
}

Registered while the component is mounted, gone when it unmounts.

Cart.vue 
<script setup>
import { useTool } from "webmcpx/vue";

useTool({
  name: "add_to_cart",
  description: "Add a product to the cart by SKU.",
  input: { sku: "string", "qty?": "integer" },
  acts: true,
  run: ({ sku, qty = 1 }) => cart.add(sku, qty),
});
</script>

Registered while the component is mounted, gone when it unmounts.

Cart.svelte 
<script>
  import { useTool } from "webmcpx/svelte";

  useTool({
    name: "add_to_cart",
    description: "Add a product to the cart by SKU.",
    input: { sku: "string", "qty?": "integer" },
    acts: true,
    run: ({ sku, qty = 1 }) => cart.add(sku, qty),
  });
</script>

Registered while the component is mounted, gone when it unmounts.

app.js 
import { tool } from "webmcpx";

tool({
  name: "add_to_cart",
  description: "Add a product to the cart by SKU.",
  input: { sku: "string", "qty?": "integer" },
  acts: true,
  run: ({ sku, qty = 1 }) => cart.add(sku, qty),
});

From npm, or imported from the same CDN as the script tag.

index.html 
<form toolname="add_to_cart" tooldescription="Add a product to the cart by SKU." action="/cart" method="post" toolautosubmit>
  <input name="sku" required toolparamdescription="Product SKU, e.g. MUG-01">
  <input name="qty" type="number" min="1" toolparamdescription="How many (default 1)">
  <button>Add to cart</button>
</form>

No JavaScript: the WebMCP declarative API. The script tag adds it where the browser doesn’t have it yet.

WebMCP vs MCP

How WebMCP differs from MCP, and why you need both

WebMCP borrows MCP’s tool model, but it is a browser API, not the MCP protocol. They complement each other.

WebMCP compared with MCP
AspectWebMCPMCP
Where tools run In your page’s JavaScript, in the user’s tab. In a server process, local (stdio) or remote.
How agents call them A browser API, document.modelContext; the browser mediates each call. No JSON-RPC. JSON-RPC 2.0 over stdio or Streamable HTTP.
What you run Your existing front end. No new server. An MCP server you host and operate.
Auth The session the user is already signed in with. No tokens to issue. OAuth-based authorization for remote servers.
Discovery Once the page is open. Nothing to find before a visit. tools/list on a known endpoint, and public registries.
Lifetime As long as the page is open. Always on, with no browser needed.
The user Present, on the same page as the agent. Optional: works headless.
Covers Tools only, with input and output schemas. Tools, resources and prompts, plus elicitation and extensions.
Hints on tools readOnlyHint, consequentialHint, untrustedContentHint. Same-origin by default. readOnlyHint, destructiveHint, idempotentHint, openWorldHint.
Status W3C Community Group draft. ChatGPT desktop and Codex call it; Chrome: origin trial. A Linux Foundation project, 10,000+ public servers.

Use both

MCP serves agents that never open your site. WebMCP serves agents working in your tab, beside your user. Run both on one backend: Shopify already does.

Sources WebMCP draft WebMCP explainer MCP specification Shopify on both

From the spec tracker

Spec requests webmcpx already handles

FAQ

Questions about WebMCP

  • What is WebMCP?

    A browser API, drafted in the W3C Web Machine Learning Community Group: a page registers tools with document.modelContext.registerTool(), and an AI agent calls them instead of reading screenshots or the page’s HTML. The tools run in the user’s own tab.

  • How do I use WebMCP from Claude Code or Codex?

    Run claude mcp add webmcpx -- npx -y webmcpx mcp (Codex: codex mcp add webmcpx -- npx -y webmcpx mcp). Your agent then opens pages in its own Chromium and gets each page’s WebMCP tools plus the standard ones, on any site.

  • How do I make my site agent-ready?

    Add the webmcpx script tag: every page gets standard tools (search, read, page context) with no other code. Then register your own actions, like search or add to cart, with tool(). Scan your site here to check.

  • Does it work in Firefox and Safari?

    Yes. Where a browser has no WebMCP of its own, webmcpx loads the W3C WebMCP polyfill, on HTTPS pages. Chrome, Firefox and Safari all see the same tools.

  • Is WebMCP a W3C standard?

    Not yet. It is a draft of the W3C Web Machine Learning Community Group (2 November 2026). Chrome and Edge run it in origin trials, Mozilla is neutral and WebKit has objections. webmcpx tracks the draft and loads the W3C polyfill, so your tools work now and move with the spec.

  • Is it safe to let agents call my site’s tools?

    The tools run in the user’s own tab, with the user’s own permissions, and can do nothing the page could not already do. webmcpx’s standard tools only read what the page shows, with invisible characters stripped. Mark your own tools that change things with consequentialHint so agents can ask the user first, and let the linter flag hidden instructions in tool descriptions.

  • Is WebMCP the same as MCP?

    No. WebMCP borrows MCP’s tool model, but it is a browser API, not the MCP protocol: the tools live in the page and run in the user’s tab. They complement each other, and the webmcpx MCP server connects the two.