Claude in Chrome

Browser automation directly from Claude Code. Navigate pages, click elements, fill forms, take screenshots, and record GIFs in Chrome.

MCP Server·3 sections·1 min read

codingresearchdesign

Install Prompt

Paste this into Claude Code to set it up:

I want to add the Claude in Chrome MCP to my Claude Code setup.

IMPORTANT: Never use Read/Edit tools on ~/.claude.json. Use jq via Bash instead.

Prerequisites: Install the Claude in Chrome browser extension from the Chrome Web Store. The extension runs a local MCP server that Claude Code connects to.

Run this command to add the MCP server:
```bash
jq '.mcpServers["claude-in-chrome"] = {"type": "http", "url": "http://localhost:21415/mcp"}' ~/.claude.json > /tmp/claude-json-tmp && mv /tmp/claude-json-tmp ~/.claude.json
```

After adding, restart Claude Code. Make sure Chrome is open with the extension active. The server connects to whatever tab is currently focused in Chrome.

01What It Does

Your agent can see and interact with the browser

Claude in Chrome turns your browser into an interactive tool for your AI agent. Instead of describing what you see on screen, the agent can navigate to pages, read rendered content, click buttons, fill out forms, and capture exactly what it sees. This is essential for visual QA, debugging CSS issues, and testing user flows.

📸

Screenshots and GIFsCapture the current page state as a screenshot or record a GIF of a multi step interaction. Perfect for visual QA and bug reports.

🖱️

Click, Type, and NavigateNavigate to URLs, click elements by selector or coordinates, fill form fields, and interact with pages as a user would.

🔍

Read Page ContentExtract text, inspect the DOM, read console messages, and monitor network requests from the currently active tab.

02Setup

# Add to ~/.claude.json under mcpServers
"claude-in-chrome": {
"type": "http",
"url": "http://localhost:21415/mcp"
}

The Chrome extension must be installed and Chrome must be running for the MCP server to be reachable. If the connection fails, check that the extension is enabled and that no other process is using port 21415.

03Available Tools

🧭

Navigation and TabsNavigate to URLs, create new tabs, switch between tabs, and resize the browser window to test responsive layouts.

📝

Forms and InputFill input fields, submit forms, upload images, and interact with any page element using CSS selectors.

🎬

Recording and DebuggingRecord GIFs of interactions, read console messages, monitor network requests, and execute custom JavaScript on the page.