本文へスキップ
Kitbay
掲載依頼

Chrome DevToolsのMCPサーバーとエージェントスキル

AIアシスタントをChrome DevToolsにつなぐMCPサーバーが93件、エージェントスキルが60件あります。Googleの公式掲載が9件あります。

ページの検証、デバッグ、プロファイリングのためにGoogle Chromeに組み込まれたWeb開発者向けツール。

MCPサーバー93件スキル60件公式9件Google

最終確認

すべての掲載

153

並び順:公式を優先し、品質と活動状況の順。すべて表示(活動の少ない掲載も含む)

AIとChrome DevToolsをつなぐ方法

Chromeのデバッグ機能は、Chrome DevTools Protocolを通じてプログラムから利用できます。プロトコルのドキュメントはプロトコルビューアーで公開されており、最新版と安定版のChrome、そしてNode.jsが使うV8インスペクターが対象です。TypeScriptの型定義はnpmパッケージdevtools-protocolとして配布されています。ChromeDevToolsチームはchrome-devtools-mcpも公開しています。これはコーディングエージェントが実行中のChromeを操作できるようにするMCPサーバー兼CLIで、パフォーマンストレースの記録、ネットワークリクエストやコンソールメッセージの確認、スクリーンショットの撮影、Puppeteerによるページ操作の自動化ができます。

ベンダーのドキュメントより: ChromeDevTools/devtools-protocol on GitHub, ChromeDevTools/chrome-devtools-mcp on GitHub

ガイド:MCPサーバーとエージェントスキルの違いMCPサーバーをAIクライアントに接続する

よくある質問

Chrome DevToolsの公式MCPサーバーはありますか?
はい。Chrome DevTools向けの掲載のうち9件はツールのベンダーが公開しているもので、上の表で「公式」と表示し、根拠へのリンクを付けています。
ClaudeでChrome DevToolsを使えますか?
はい、MCPサーバーを使えば可能です。ClaudeなどのAIアシスタントをChrome DevToolsにつなぐMCPサーバーが93件あり、各掲載で接続方式とインストール方法を確認できます。
Chrome DevTools向けのエージェントスキルはありますか?
はい、60件掲載しています。スキルは指示(場合によってはスクリプトも)をまとめたフォルダで、タスクに必要になったときにエージェントが読み込みます。
Chrome DevTools向けのサーバーやスキルは、どのAIクライアントに対応していますか?
このページの掲載でよく記載されているのはclaude-code, vscode, gemini-cli, codexです。各掲載には、それぞれのドキュメントに書かれているクライアントを表示しています。