Chrome DevTools MCP

Lets an assistant control and inspect a live Chrome browser: automate pages, debug, trace performance.

Official · ChromeDevTools TypeScript Local · stdio Browser automationDeveloper tools

125 popularity score ★ 55k ↓ 1.9M/wk

Connect your client

Local (npm)

Add in one click

Opens the app, which asks before it adds the server.

Or add it by command or config

Claude CodeTerminal
claude mcp add chrome-devtools -- npx -y chrome-devtools-mcp
Claude Desktopclaude_desktop_config.json
{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp"
      ]
    }
  }
}
Cursor~/.cursor/mcp.json
{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp"
      ]
    }
  }
}
VS Code.vscode/mcp.json
{
  "servers": {
    "chrome-devtools": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp"
      ]
    }
  }
}
Codex~/.codex/config.toml
[mcp_servers.chrome-devtools]
command = "npx"
args = ["-y", "chrome-devtools-mcp"]
Gemini CLITerminal
gemini mcp add --scope user chrome-devtools npx -- -y chrome-devtools-mcp

Settings 2

CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS Optional: When set, turns off the usage statistics Google collects by default (same as --no-usage-statistics).
CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS Optional: When set, stops the periodic check of the npm registry for newer versions.

What it does

Chrome DevTools MCP (also called Chrome DevTools for agents, package chrome-devtools-mcp) is the Chrome DevTools team's MCP server. It gives a coding assistant control of a live Chrome browser through Puppeteer and the DevTools protocol, so it can open and navigate pages, click, fill forms, upload files and handle dialogs, then check the result.

Its debugging tools read console messages with source-mapped stack traces, list and inspect network requests, take screenshots and accessibility-tree snapshots, read CSS styles, run JavaScript in the page and run Lighthouse audits. Performance tools record traces and pull out insights such as Core Web Vitals (LCP, INP, CLS). Opt-in tool groups cover heap snapshots and memory-leak analysis, Chrome extensions, Progressive Web Apps, WebMCP tools, screencasts and coordinate-based clicks. A --slim mode exposes just three tools for basic browsing.

It needs Node.js (LTS), npm and current stable Chrome, and runs with npx chrome-devtools-mcp@latest. It starts its own Chrome when a tool first needs one, with a profile kept under the user's cache directory unless --isolated is set, or connects to a running Chrome through --browserUrl, --wsEndpoint or --autoConnect. A CLI is also provided for use without MCP.

Tools 59

click
Clicks on the provided element
drag
Drag an element onto another element
fill
Type text into an input, text area or select an option from a <select> element.
fill_form
Fill out multiple form elements (inputs, selects, checkboxes, radios) at once. ALWAYS prefer this tool over multiple individual 'fill' or 'click' calls when interacting with forms. It is significantly faster, more reliable, and reduces turn count. Example: Fill username, password, and check...
handle_dialog
If a browser dialog was opened, use this command to handle it
hover
Hover over the provided element
press_key
Press a key or key combination. Use this when other input methods like fill() cannot be used (e.g., keyboard shortcuts, navigation keys, or special key combinations).
type_text
Type text using keyboard into a previously focused input
upload_file
Upload a file through a provided element.
click_at
Clicks at the provided coordinates (requires flag: --experimentalVision=true)
close_page
Closes the page by its index. The last open page cannot be closed.
list_pages
Get a list of pages open in the browser.
navigate_page
Go to a URL, or back, forward, or reload. Use project URL if not specified otherwise.
new_page
Open a new tab and load a URL. Use project URL if not specified otherwise.
select_page
Select a page as a context for future tool calls.
wait_for
Wait for the specified text to appear on the selected page.
emulate
Emulates various features on the target page.
resize_page
Resizes the page's window so that the page has specified dimension
performance_analyze_insight
Provides more detailed information on a specific Performance Insight of an insight set that was highlighted in the results of a trace recording.
performance_start_trace
Start a performance trace on the target webpage. Use to find frontend performance issues, Core Web Vitals (LCP, INP, CLS), and improve page load speed.
performance_stop_trace
Stop the active performance trace recording on the target webpage.
get_network_request
Gets a network request by an optional reqid, if omitted returns the currently selected request in the DevTools Network panel. Useful for inspecting request headers (including 'Cookie') and response headers (including 'Set-Cookie' and directives).
list_network_requests
Lists the most recent requests for the target page since the last navigation.
evaluate_script
Evaluate JavaScript inside the target page. The source can be provided inline or loaded from a local file. Returns the response as JSON, so returned values have to be JSON-serializable.
get_console_message
Gets a console message by its ID. You can get all messages by calling list_console_messages.
get_css_styles
Retrieve matched CSS rules, inline styles (element.style), inherited styles, custom properties, and cascade wrappers (@layer, @media, @container, @scope) for an element identified by its UID.
lighthouse_audit
Get Lighthouse score and reports for accessibility, SEO, best practices, and agentic browsing. This excludes performance. For performance audits, run performance_start_trace
list_console_messages
List all console messages for the target page since the last navigation.
take_screenshot
Take a screenshot of the page or element.
take_snapshot
Take a text snapshot of the target page based on the a11y tree. The snapshot lists page elements along with a unique
screencast_start
Starts recording a screencast (video) of the target page in specified format. (requires flag: --experimentalScreencast=true)
screencast_stop
Stops the active screencast recording on the target page. (requires flag: --experimentalScreencast=true)
take_heapsnapshot
Capture a heap snapshot of the target page. Use to analyze the memory distribution of JavaScript objects and debug memory leaks.
analyze_heapsnapshot_contexts
Loads a memory heapsnapshot to identify and rank closure contexts holding dead captured fields—variables no remaining live closure can read. Scopes are ranked globally by the retained size of these dead values to provide a prioritizing heuristic, rather than an exact measure of reclaimable...
close_heapsnapshot
Closes a previously loaded memory heapsnapshot, freeing its memory. (requires flag: --memoryDebugging=true)
compare_heapsnapshots
Loads two memory heapsnapshots and returns the comparison. If classIndex is provided, returns detailed diff for that class, otherwise returns summary diff. (requires flag: --memoryDebugging=true)
get_heapsnapshot_class_nodes
Loads a memory heapsnapshot and returns instances of a specific class with their IDs. (requires flag: --memoryDebugging=true)
get_heapsnapshot_details
Loads a memory heapsnapshot and returns all available information including statistics, static data, and aggregated node information. Supports pagination for aggregates. (requires flag: --memoryDebugging=true)
get_heapsnapshot_dominators
Loads a memory heapsnapshot and returns the dominator chain for a specific node ID. This helps to identify which objects are keeping the target node alive. (requires flag: --memoryDebugging=true)
get_heapsnapshot_duplicate_strings
Loads a memory heapsnapshot and returns duplicate strings grouped by their value. (requires flag: --memoryDebugging=true)
get_heapsnapshot_edges
Loads a memory heapsnapshot and returns outgoing edges (references) for a specific node ID. (requires flag: --memoryDebugging=true)
get_heapsnapshot_object_details
Loads a memory heapsnapshot and returns detailed information about a specific object by its node ID, including size, type, distance, and DOM detachedness. (requires flag: --memoryDebugging=true)
get_heapsnapshot_retainers
Loads a memory heapsnapshot and returns retainers for a specific node ID. (requires flag: --memoryDebugging=true)
get_heapsnapshot_retaining_paths
Loads a memory heapsnapshot and returns retaining paths for a specific node ID. This helps to understand why a node is not being garbage collected. (requires flag: --memoryDebugging=true)
get_heapsnapshot_summary
Loads a memory heapsnapshot and returns snapshot summary stats, including native contexts and their sizes, and retained by context summary. (requires flag: --memoryDebugging=true)
query_heapsnapshot_objects
Loads a memory heapsnapshot and queries objects matching specific filters (className, propertyName, nodeType, retainedSize, selfSize, isDetached, sortBy). (requires flag: --memoryDebugging=true)
install_extension
Installs a Chrome extension from the given path. (requires flag: --categoryExtensions=true)
list_extensions
Lists all the Chrome extensions installed in the browser. This includes their name, ID, version, and enabled status. (requires flag: --categoryExtensions=true)
reload_extension
Reloads an unpacked Chrome extension by its ID. (requires flag: --categoryExtensions=true)
trigger_extension_action
Triggers the default action of an extension by its ID. (requires flag: --categoryExtensions=true)
uninstall_extension
Uninstalls a Chrome extension by its ID. (requires flag: --categoryExtensions=true)
execute_3p_developer_tool
Executes a tool exposed by the page. (requires flag: --categoryExperimentalThirdParty=true)
list_3p_developer_tools
Lists all third-party developer tools the page exposes for providing runtime information.
execute_webmcp_tool
Executes a WebMCP tool exposed by the page. (requires flag: --categoryExperimentalWebmcp=true)
list_webmcp_tools
Lists all WebMCP tools the page exposes. (requires flag: --categoryExperimentalWebmcp=true)
get_os_app_state
Returns the OS integration state (badge count and registered file handlers) for an installed web app, identified by its manifest ID. (requires flag: --categoryPwa=true)
install_pwa
Installs a Progressive Web App (PWA) identified by its manifest ID. This installs through the PWA CDP domain without a user gesture or install dialog. DevTools installs default to browser display mode. (requires flag: --categoryPwa=true)
launch_pwa
Launches an installed Progressive Web App using its saved display mode. Optionally opens a specific URL within the same app instead of the default start URL. (requires flag: --categoryPwa=true)
uninstall_pwa
Uninstalls a Progressive Web App identified by its manifest ID and closes any open app windows. (requires flag: --categoryPwa=true)

Similar servers