WebMCP (Web Model Context Protocol) is a proposed W3C web standard being incubated by the Web Machine Learning Community Group. It enables websites to expose AI-callable tools through the browser's navigator.modelContext API, allowing AI agents to discover and interact with web applications directly in the browser.

WebMCP is optimized for browser-based, user-present interactions with built-in web security features, leveraging the browser's origin-based security model and user authentication. Learn more in the W3C WebMCP Explainer.

MCP-B bridges the gap between WebMCP and the Model Context Protocol (MCP), serving two critical functions:

1. API Implementation — Provides a polyfill that implements the navigator.modelContext interface for browsers lacking native support
2. Protocol Translation — Converts between WebMCP's web-native format and the MCP protocol, enabling cross-compatibility

MCP-B creates interoperability by enabling WebMCP-formatted tools to function with MCP clients (like Claude Desktop), and MCP-formatted tools to operate within WebMCP-enabled browsers. This allows both standards to evolve independently without breaking existing implementations.

All MCP-B libraries and SDKs are open source (MIT Licensed), enabling developers to build WebMCP-enabled applications freely. However, the browser extension for connecting to MCP clients is not open source.

For developers interested in contributing to browser extension development, check out the POC MCP-B Extension (AGPL-3.0) by the community.

• Browser-Native MCP — Implements W3C Web Model Context API for standardized AI tool registration
• Secure by Default — Leverages browser authentication and origin-based security model
• Zero Backend Required — Expose tools directly from your frontend application
• Agent-Ready — Works with Claude, ChatGPT, and any MCP-compatible AI client
• Framework Agnostic — React hooks, vanilla JS, and framework-specific integrations available

# Install the core package
npm install @mcp-b/global

# Or use React hooks
npm install @mcp-b/react-webmcp

// Register a tool that AI agents can discover and call
navigator.modelContext.registerTool({
  name: "get_user_profile",
  description: "Get the current user's profile information",
  inputSchema: {
    type: "object",
    properties: {},
  },
  handler: async () => {
    return { name: "John Doe", email: "john@example.com" };
  }
});

View Full Documentation →

• Documentation — Comprehensive guides, API references, and examples
• Live Demo — Interactive tool examples and playground
• Browser Extension — Chrome extension for tool discovery
• Best Practices — Tool design patterns and security guidelines
• AI Framework Integration — Connect with Assistant-UI, AG-UI, and more

• Discord — Get help, share ideas, and collaborate
• GitHub Issues — Report bugs and request features
• Contributing — Learn how to contribute to MCP-B
• Code of Conduct — Our community standards

• Interactive Dashboards — Let AI agents query metrics and visualize data
• E-commerce Sites — Enable natural language product search and checkout
• Documentation Sites — AI-powered search and content generation
• SaaS Applications — Expose app functionality as composable AI tools
• Admin Panels — Voice and chat-based admin controls

MCP-B is open source software licensed under the MIT License.