Skip to main content
WebMCP lets websites expose tools that AI agents can discover and call. This section covers the different ways agents can connect to your tools.

​
Connection Options

Embedded Agent

Recommended - Drop-in AI assistant for your website

AI Browsers

Native browser AI (Chrome AI, Perplexity, etc.)

MCP-B Extension

Browser extension for any website

Chrome DevTools MCP

Development and testing via DevTools Protocol

​
Comparison

MethodSetupBest ForRequirements
Embedded AgentAdd <webmcp-agent> elementProduction websitesApp ID
AI BrowsersNoneFuture-proof integrationAI-enabled browser
MCP-B ExtensionInstall extensionTesting, any websiteChrome extension
Chrome DevTools MCPMCP client configDevelopment, automationChrome + MCP client

​
How It Works

All methods follow the same pattern:
  1. Your website registers tools via navigator.modelContext
  2. The agent discovers available tools
  3. When needed, the agent calls tools with arguments
  4. Tools execute in the browser and return results

​
Quick Start

The fastest way to get started is with the Embedded Agent: 
<script type="module">
  import 'https://unpkg.com/@mcp-b/global@latest/dist/index.esm.js';
  import 'https://unpkg.com/@mcp-b/embedded-agent@latest/dist/web-component.esm.js';
</script>

<webmcp-agent
  app-id="your-app-id"
  api-base="https://your-api-endpoint"
/>

Get Started with Embedded Agent

Complete setup guide and configuration options