Chrome DevTools MCP: The Complete Guide to Google's Official MCP Server for Coding Agents
Chrome DevTools MCP is the official MCP server from Google's ChromeDevTools team — giving coding agents full access to Chrome DevTools capabilities. Performance tracing, network analysis, screenshots, Lighthouse audits, browser automation with Puppeteer. 29 tools across 6 categories. 28,200+ stars, TypeScript, Apache-2.0.
What Is Chrome DevTools MCP?
An MCP (Model Context Protocol) server that exposes Chrome DevTools functionality to AI coding agents. Your agent can inspect pages, debug issues, analyze performance, automate interactions, and audit web apps — all through standard MCP tool calls.
- Stars: 28,200+ ⭐
- Forks: 1,656
- Releases: 38
- Contributors: 63
- Language: TypeScript
- License: Apache-2.0
- Author: ChromeDevTools (Official Google)
- npm: chrome-devtools-mcp
Getting Started
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest"]
}
}
}
For basic browser tasks only, use --slim mode:
"args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
29 Tools in 6 Categories
🖱️ Input Automation (9 tools)
| Tool | Purpose |
|---|---|
click | Click elements |
drag | Drag elements |
fill | Fill input fields |
fill_form | Fill entire forms |
handle_dialog | Handle browser dialogs |
hover | Hover over elements |
press_key | Press keyboard keys |
type_text | Type text |
upload_file | Upload files |
🧭 Navigation Automation (6 tools)
| Tool | Purpose |
|---|---|
navigate_page | Navigate to URL |
new_page | Open new page |
close_page | Close page |
list_pages | List open pages |
select_page | Switch between pages |
wait_for | Wait for conditions |
📱 Emulation (2 tools)
| Tool | Purpose |
|---|---|
emulate | Emulate device |
resize_page | Resize viewport |
⚡ Performance (4 tools)
| Tool | Purpose |
|---|---|
performance_start_trace | Start performance trace |
performance_stop_trace | Stop trace |
performance_analyze_insight | Extract actionable insights |
take_memory_snapshot | Memory snapshot |
🌐 Network (2 tools)
| Tool | Purpose |
|---|---|
list_network_requests | List all network requests |
get_network_request | Get request details |
🔍 Debugging (6 tools)
| Tool | Purpose |
|---|---|
evaluate_script | Execute JavaScript |
list_console_messages | List console messages |
get_console_message | Get specific message |
lighthouse_audit | Run Lighthouse audit |
take_screenshot | Take screenshot |
take_snapshot | Take page snapshot |
Key Features
- Performance Insights: Record traces with DevTools, extract actionable performance insights
- CrUX Field Data: Fetches real-user experience data from Google CrUX API for holistic performance picture
- Source-Mapped Stack Traces: Console messages with proper source mapping
- Puppeteer Automation: Reliable action automation with automatic waiting
- Lighthouse Audits: Full Lighthouse audits from within MCP
- Android Debugging: Debug Chrome on Android devices
- WebSocket Support: Connect via WebSocket with custom headers
- Slim Mode: Lightweight mode for basic browser tasks
Chrome DevTools MCP vs Alternatives
Category: This is a browser automation MCP server for coding agents.
| Feature | Chrome DevTools MCP | Playwright MCP | Browserbase MCP | Puppeteer MCP |
|---|---|---|---|---|
| Focus | Official Chrome DevTools | Browser automation | Cloud browser | Puppeteer wrapper |
| Stars | 28.2K ⭐ | ~7K ⭐ | ~3K ⭐ | ~4K ⭐ |
| Author | Google (Official) | Microsoft | Browserbase | Community |
| Tools | 29 | ~20 | ~15 | ~10 |
| Performance Tracing | ✅ DevTools traces | ❌ | ❌ | ❌ |
| Lighthouse Audits | ✅ | ❌ | ❌ | ❌ |
| CrUX Field Data | ✅ | ❌ | ❌ | ❌ |
| Memory Snapshots | ✅ | ❌ | ❌ | ❌ |
| Network Analysis | ✅ | ✅ | ✅ | Limited |
| Source-Mapped Traces | ✅ | ❌ | ❌ | ❌ |
| Android Debugging | ✅ | ❌ | ❌ | ❌ |
| Slim Mode | ✅ | ❌ | ❌ | ❌ |
| Headless | ✅ | ✅ | Cloud | ✅ |
When to choose Chrome DevTools MCP: You want the official Google DevTools experience — performance tracing, Lighthouse, CrUX, memory snapshots, and full debugging power.
When to choose Playwright MCP: You want cross-browser automation (Chrome, Firefox, Safari).
When to choose Browserbase MCP: You need cloud-hosted browser sessions for scale.
Conclusion
Chrome DevTools MCP is the definitive MCP server for browser debugging and automation, built by the Chrome DevTools team itself. 29 tools covering input, navigation, emulation, performance, network, and debugging — with exclusive features like DevTools performance tracing, Lighthouse audits, CrUX field data, and memory snapshots that no other MCP server offers. With 28.2K stars and official Google backing, it's the standard for AI agents that need to understand and interact with the web.
Explore Chrome DevTools MCP on GitHub