Berikan kecanggihan DevTools ke agen coding Anda melalui server MCP DevTools atau CLI dan keterampilan khususnya.

Chrome DevTools berfungsi dengan setiap agen yang mendukung server MCP: Gemini CLI, Antigravity, Claude Code, Codex, dan lainnya. Gunakan server MCP untuk memberi tahu agen Anda tentang kemampuan DevTools dengan setiap sesi.
Sebagai alternatif yang lebih hemat token untuk server MCP, Anda dapat menggunakan CLI Chrome DevTools. Paket server MCP Chrome DevTools mencakup skill khusus yang mengajarkan agen coding Anda cara menulis skrip, menggunakan alat canggih yang sama dengan server MCP.

Pasang sekarang

Server MCP dan CLI adalah bagian dari paket yang sama. Dapatkan untuk agen coding pilihan Anda. Temukan petunjuk untuk agen paling populer di bawah, dan petunjuk untuk lebih dari 20 agen di GitHub.

  # Either MCP only:
  gemini mcp add chrome-devtools npx chrome-devtools-mcp@latest
  # Or as a Gemini extension (MCP+Skills):
  gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp
  # Either MCP only:
  claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest
  # Or as a plugin (MCP+Skills):
  /plugin marketplace add ChromeDevTools/chrome-devtools-mcp
  /plugin install chrome-devtools-mcp
  codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest

Setelah menginstal server atau CLI MCP DevTools, coba beberapa perintah untuk memulai. Minta audit Lighthouse, isi formulir, atau minta screenshot - semuanya dari agen Anda. Untuk melihat semua kemampuan tersebut beraksi, misalnya, coba perintah berikut:

  Visit developer.chrome.com and run a search for "devtools",
  while recording a performance trace.
  Let me know how I can improve the website's performance.

Perintah ini menggunakan alat untuk membuat halaman baru, berinteraksi dengan kotak penelusuran, dan menjalankan rekaman aktivitas performa, termasuk data CrUX.