DevCDP
MCP server by Dayananda-D
Inspect and debug web pages through Chrome DevTools: console, network, DOM, source maps, breakpoints and live variables.
Install DevCDP
Runs on your machine. Your client starts it with this command:
Needs Node.js on your computer. The setup steps below show where the command goes in each client.
DEVCDP_CHROME_PATHoptional Path to the Chrome executable, when it is not on the default install path.DEVCDP_LOG_LEVELoptional Server log verbosity on stderr: debug, info, warn or error.
Share this server
Opens this page, with the install command and setup steps.
mcp.tc/i/devcdpAbout
DevCDP gives an AI assistant access to Chrome DevTools. According to its registry description, it covers the console, network activity, the DOM, source maps, breakpoints and live variables, so the assistant can debug a running page with real browser data.
It runs locally over stdio and is started with npx from the devcdp npm package. No API key is required. Chrome must be installed. If it is not at the default path, set DEVCDP_CHROME_PATH. DEVCDP_LOG_LEVEL controls log verbosity on stderr.
What you can do
- Read browser console output
- Inspect network activity
- Inspect the DOM
- Work with source maps
- Use breakpoints and read live variables
Tools
Local servers list their tools once they’re running, and this one doesn’t publish its list in advance. Your client shows them after you add it.
Example prompts
Check the browser console for errors on this page.
Show me the failing network requests on the page I have open.
Set a breakpoint in my checkout handler and show the live variables.
Inspect the DOM of the login form and tell me why the button is hidden.
Set up
Every client starts DevCDP on your machine with the same command. Pick yours; the page remembers your choice.
Claude Code
- Run this in a terminal, in your project folder:
claude mcp add --transport stdio devcdp -- npx -y devcdp- Start Claude Code and type
/mcp. devcdp should show as connected.
Add --scope user to make it available in every project.
Claude Desktop
- Open Settings → Developer → Edit Config. It opens
claude_desktop_config.json. Add:
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}- Save the file and restart Claude Desktop.
Needs Node.js on your computer. The file lives in ~/Library/Application Support/Claude/ on macOS and %APPDATA%\Claude\ on Windows.
Cursor
Add to Cursor (opens in a new tab)
Or add it by hand to ~/.cursor/mcp.json (all projects) or .cursor/mcp.json (this project):
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}Needs Node.js on your computer.
VS Code
Install in VS Code (opens in a new tab)
Or from a terminal:
code --add-mcp '{"name":"devcdp","type":"stdio","command":"npx","args":["-y","devcdp"]}'Or commit it to the repo in .vscode/mcp.json:
{
"servers": {
"devcdp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}Needs Node.js on your computer.
Devin Desktop
- Add it to
~/.config/devin/mcp_config.json(macOS and Linux) or%APPDATA%\devin\mcp_config.json(Windows):
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}- Refresh the MCP server list in Cascade.
Devin Desktop is the new name for Windsurf.
Codex
codex mcp add devcdp -- npx -y devcdpOr edit ~/.codex/config.toml directly:
[mcp_servers.devcdp]
command = "npx"
args = ["-y", "devcdp"]Needs Node.js on your computer.
Gemini CLI
gemini mcp add devcdp npx -- -y devcdpThis adds it to the current project. Add -s user to use it everywhere.
Any client
Most clients that start local servers accept this shape:
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}Zed puts servers under context_servers in its settings, with the same command, args and env fields.
Needs Node.js on your computer.
Embed
Show DevCDP in a README or on your site. Each embed links to this page, uses the server’s own install command, and sets no cookies. How embeds work
The card, the iframe and the JSON are in English. Add ?lang=it, fr, de or es to their address for another language.
README badge
[](https://mcp.tc/i/devcdp)<a href="https://mcp.tc/i/devcdp"><img src="https://mcp.tc/i/devcdp/badge.svg" alt="DevCDP on mcp.tc" height="20"></a>It follows the reader’s light or dark mode. Add ?theme=light or ?theme=dark to fix it, or ?style=compact to show the mark without the word.
Website card
<script src="https://mcp.tc/w/devcdp.js" async></script>The card appears where the tag is. Add data-theme="dark" or data-size="compact" to the tag to change it. The file holds everything it needs, so it makes no other requests and sets no cookies.
iframe
<iframe src="https://mcp.tc/embed/devcdp" title="DevCDP on mcp.tc" width="420" height="200" loading="lazy" allow="clipboard-write" style="border:0;border-radius:8px;max-width:100%"></iframe>Use it on pages that don’t allow scripts. Add ?theme=light or ?theme=dark to the address to fix the colors.
JSON
The listing as data for your own pages and tools: name, tagline, install command, tools and the “Add to” links. Any site can read it (CORS is open).
https://mcp.tc/i/devcdp.jsonAI prompt
Paste this into an AI coding assistant, such as Claude Code or Cursor, and it adds the DevCDP card to your site.
Add the mcp.tc card for DevCDP, an MCP server, to my website. It is one static script: no build step, no package to install, no cookies.
Put this tag where the card should appear. The card renders right before it:
```html
<script src="https://mcp.tc/w/devcdp.js" async></script>
```
To show the card somewhere else, put this placeholder there and load the same script once, for example before `</body>`. Keep the link inside: visitors without JavaScript see it.
```html
<div data-mcptc="devcdp"><a href="https://mcp.tc/i/devcdp">DevCDP on mcp.tc</a></div>
```
Options:
- `data-theme="light"` or `"dark"` on the tag or the placeholder fixes the colors. Without it, the card follows the visitor’s light or dark mode.
- `data-size="compact"` gives a smaller card without the tagline.
- The CSS variable `--mcptc-max-width` on the placeholder or a parent sets the width (default `520px`).
- `?lang=` on the script URL sets the card’s language: `en`, `it`, `fr`, `de` or `es`.
If the site has a Content Security Policy, allow `script-src https://mcp.tc` and `img-src data:` (the icon is inline).
For a README or other Markdown docs, use the badge instead:
```markdown
[](https://mcp.tc/i/devcdp)
```
Reference: https://mcp.tc/embedChange history
This server runs on your computer, so we follow its npm package: each new version shows up here, with edits by its owner.
FAQ
Can I paste mcp.tc/i/devcdp into my MCP client?
No. DevCDP runs on your own computer, started by your client, so it has no web address to connect to. The quick link is the page to share; the install command is npx -y devcdp.
Does DevCDP need an API key?
No. It doesn’t declare any keys or environment variables. It runs with your user account’s permissions, so check what its tools can reach.
Is DevCDP a remote or a local server?
Local. Your client starts it as a process on your computer with npx -y devcdp, which needs Node.js.
What can DevCDP do?
You can read browser console output, inspect network activity and inspect the DOM.
Which clients can use it?
Any client that starts local servers: Claude Code, Claude Desktop, Cursor, VS Code, Devin Desktop, Codex, Gemini CLI, Zed and others. claude.ai and ChatGPT only connect to remote servers.
Does mcp.tc track changes to DevCDP?
Partly. It runs on your computer, so we follow its npm package: its History tab shows each new version and edits by its owner. Follow the listing to get an email when it changes.
Who wrote this page?
mcp.tc’s robot read DevCDP’s public metadata (its package and repository pages), and an AI model drafted the text from it. A person reviews anything the checks can’t confirm. The text can still be wrong, so if you spot a mistake, use Report this listing on this page.
mcp.tc isn’t affiliated with Dayananda-D. This page was built from DevCDP’s public metadata, last checked on 5 Oct 2026, and an AI model wrote the description, so it can be wrong. Names and marks belong to their owners. Something off? Report this listing.