Install MCP-B Extension
Get the extension from the Chrome Web Store
Connect to Desktop AI with Native Host
Unlock the full power of WebMCP: The native host bridges your browser tools to desktop AI assistants like Claude Code and Claude Desktop. This means you can use browser-based tools from your command line or desktop apps!
Setup Native Host
Start here - Connect browser tools to Claude Code, Claude Desktop, and other MCP clients
How It Works
Learn about the architecture behind browser-to-desktop integration
Quick Navigation
Jump to the section that best matches your needs:Understanding Agents
Learn about the 4 specialized agents and when to use each one
Managing Userscripts
Create, download, upload, and organize custom scripts
What Can You Do?
Connect Desktop AI
Use browser tools from Claude Code, Claude Desktop, and other desktop MCP clients
AI-Powered Development
Work with specialized AI agents that understand web development and can build scripts for you
Customize Websites
Add dark modes, remove ads, change layouts, and enhance any website with custom userscripts
Automate Tasks
Auto-fill forms, extract data, and streamline repetitive workflows with intelligent scripts
Build MCP Tools
Expose website functionality as tools that AI agents can discover and use
Cross-Site Workflows
Chain actions across multiple tabs and sites for complex automation
Quick Start
1
Install the extension
Download from the Chrome Web Store
2
Open the extension
Click the MCP-B icon in your browser toolbar
3
Choose an agent
Select from Userscript Engineer, WebMCP Server, Browsing Agent, or Chat Companion
4
Start creating
Describe what you want to build and let the AI agent help you create it
Core Features
AI Agents
Four specialized agents help you accomplish different tasks:- Userscript Engineer
- WebMCP Server
- Browsing Agent
- Chat Companion
Build custom scripts to enhance websitesPerfect for adding features, removing clutter, or automating repetitive tasks. The Userscript Engineer helps you create production-grade userscripts through conversation.
Learn About Agents
Understand when to use each agent
Userscript Management
Create, organize, and share custom scripts:Create with AI
Describe what you want in plain language - the agents build it for you
Download & Upload
Export scripts to share with others or back up your library
Enable/Disable
Turn scripts on and off without deleting them
Edit & Update
Modify existing scripts through conversation or manual editing
Managing Userscripts
Complete guide to downloading, uploading, and organizing scripts
MCP Tool Integration
The extension implements the Model Context Protocol, enabling:- Tool Discovery: Automatically detect MCP tools on websites
- Tool Execution: Call website tools from AI agents
- Tool Creation: Build your own MCP servers as userscripts
- Native MCP Support: Connect to traditional MCP servers via native host
WebMCP is a polyfill for the W3C Web Model Context API (
navigator.modelContext) - a standards-track proposal for exposing website functionality to AI agents. The API supports Zod schemas (preferred) as well as JSON Schema for type-safe tool definitions.How It Works
Architecture
Extension Components
Agent Interface
Agent Interface
Chat interface with specialized AI agents that understand web automation and MCP. Switch between agents based on your current task.
Userscript Manager
Userscript Manager
Built-in manager for creating, editing, enabling, and organizing userscripts. Export and import scripts to share with others.
MCP Transport
MCP Transport
Browser-specific implementation of the Model Context Protocol that works entirely in the browser without backend servers.
Extension Tools
Extension Tools
Suite of MCP tools for DOM inspection, tab management, userscript execution, and browser automation.
Native Host Bridge
Native Host Bridge
Optional component that connects browser MCP to traditional filesystem-based MCP servers.
Use Cases
Website Customization
Dark Modes
Add custom dark themes to any website
Remove Ads
Hide unwanted ads, banners, and distracting elements
Custom Layouts
Rearrange page elements to match your preferences
Keyboard Shortcuts
Add custom hotkeys for common actions
Automation
Form Filling
Auto-populate forms with saved information
Data Extraction
Pull structured data from websites automatically
Monitoring
Track price changes, content updates, or availability
Batch Actions
Process multiple items or pages in sequence
AI Integration
Search Tools
Let AI search websites and retrieve results
Action Tools
Enable AI to click buttons, submit forms, or navigate
Data Tools
Give AI access to structured website data
Workflow Tools
Chain multiple website actions into complex workflows
Example: Building a Dark Mode
Here’s how you’d use the extension to add dark mode to a website:1
Select Userscript Engineer
Open the extension and choose “Userscript Engineer” from the agent dropdown
2
Navigate to the site
Go to the website you want to customize
3
Request the feature
Type: “Add a dark mode toggle button that changes the background to #1a1a1a and text to #e0e0e0”
4
Agent builds and tests
The agent inspects the page, writes TypeScript code, and tests it
5
Review and refine
See the changes live. Request adjustments if needed
6
Save the script
The agent commits the script. It will now run automatically on that site
Example: Creating MCP Tools
Here’s how to expose a website’s search as an MCP tool:1
Select WebMCP Server
Open the extension and choose “WebMCP Server” from the agent dropdown
2
Navigate to the site
Go to the website with the functionality you want to expose
3
Request the tools
Type: “Create MCP tools for searching this site and returning results”
4
Agent analyzes and builds
The agent inspects the search form, writes tool registration code, and tests it
5
Tools become available
After testing, the tools appear in your MCP tool list
6
Use from any agent
Any AI agent can now search that website on your behalf
Browser Compatibility
- Chrome
- Edge
- Brave
- Firefox
- Safari
✅ Fully supportedInstall from the Chrome Web Store
Privacy & Security
Local-first architecture
Local-first architecture
Userscripts run entirely in your browser. No data is sent to external servers except when you explicitly request AI agent interactions.
Script review
Script review
Always review userscripts before enabling them, especially from untrusted sources. Scripts have access to the websites they run on.
Permission model
Permission model
The extension only runs scripts on sites you specify. You control which websites each script can access.
Open source
Open source
Core MCP libraries are open source and available on GitHub for audit and contribution.
Get Help
Understanding Agents
Learn which agent to use for each task
Managing Userscripts
Download, upload, and organize your scripts
Discord Community
Get help from other users and developers
GitHub Issues
Report bugs or request features
Architecture & Development
Extension Architecture
Extension Architecture
Dive deep into how the extension works internally, including background workers, content scripts, and the MCP transport layer.
View Extension Architecture
Technical architecture documentation
Extension Tools API
Extension Tools API
Build your own Chrome extensions using MCP wrappers for Chrome Extension APIs.
View API Documentation
@mcp-b/extension-tools package docs
Next Steps
1
Install the extension
Get it from the Chrome Web Store
2
Set up Native Host (Recommended)
Connect browser tools to desktop AI with the Native Host Setup guide - use WebMCP from Claude Code, Claude Desktop, and more!
3
Learn about agents
Read Understanding Agents to choose the right agent for your task
4
Create your first script
Try asking the Userscript Engineer to add a simple feature to your favorite website
5
Explore examples
Check out the Examples Repository for inspiration
6
Join the community
Share your creations on Discord