MCP.so
Sign In

BrowserTools MCP

@wimpywarlord

About BrowserTools MCP

MCP for React Dev Tools - Use directly inside cursor

Overview

What is BrowserTools MCP?

BrowserTools MCP is a browser monitoring and interaction tool that enables AI-powered applications via Anthropic's Model Context Protocol (MCP) to capture and analyze browser data through a Chrome extension. It runs on any MCP‑compatible client such as Cursor, Claude Desktop, Cline, or Zed, and is primarily designed for Cursor IDE integration.

How to use BrowserTools MCP?

Install the Chrome extension from the provided release ZIP, then run npx @agentdeskai/browser-tools-mcp@latest inside your IDE and npx @agentdeskai/browser-tools-server@latest in a separate terminal window. After these steps, open Chrome DevTools and activate the BrowserToolsMCP panel. The system automatically discovers hosts and ports, and supports auto‑reconnect.

Key features of BrowserTools MCP

  • Captures screenshots, console logs, network activity, and DOM elements
  • Runs accessibility, performance, SEO, and best practices audits via Lighthouse
  • Offers a dedicated NextJS audit and an all‑in‑one Audit Mode
  • Debugger Mode executes all debugging tools in a sequence
  • Auto‑paste screenshots into Cursor when enabled in the DevTools panel
  • All logs stay local; cookies and sensitive headers are stripped before sending

Use cases of BrowserTools MCP

  • Debugging web pages by monitoring console output and network traffic inside an AI‑powered IDE
  • Checking on‑page SEO issues and getting optimization suggestions without leaving the editor
  • Evaluating pages for WCAG compliance and identifying accessibility gaps
  • Identifying performance bottlenecks (render‑blocking resources, large DOM, unoptimized images)
  • Running a full audit sequence to review best practices and framework‑specific (NextJS) issues

FAQ from BrowserTools MCP

How does BrowserTools MCP differ from other browser tools?

BrowserTools MCP is built specifically for the Model Context Protocol, enabling AI clients like Cursor to interact directly with browser data (screenshots, logs, audits) without manual copy‑paste. It runs entirely locally and never sends data to third‑party services.

Which platforms and models does it support?

It works with any MCP‑compatible client (Cursor, Claude Desktop, Cline, Zed, etc.) and the Anthropic AI models underlying those clients. The Chrome extension requires a Chromium‑based browser.

How do I set up the MCP server?

You add npx @agentdeskai/browser-tools-mcp@latest to your IDE’s MCP configuration (exact setup depends on the IDE), then run npx @agentdeskai/browser-tools-server@latest in a separate terminal window.

Is BrowserTools MCP free and what are the licensing terms?

The README does not mention pricing or a specific license. The project is open‑source on GitHub under the AgentDeskAI organization.

Are there any known limitations?

All data stays local and is never sent externally. Ensure you close all other Chrome DevTools instances before use. Windows connectivity issues were resolved in v1.2.0. The headless browser instance for audits remains active for 60 seconds after the last call.

Comments

More IDE & Code Editors MCP clients