Chrome Devtools CLI skill

O Claude abre o site no Chrome, clica, preenche formulário, tira print e mede a velocidade com comandos de terminal que viram script.

por chromedevtools

instalações: 6.800
estrelas no GitHub: 54,2 mil
No skills.sh desde: março de 2026
Licença: Apache-2.0

Atualizada no GitHub em 25 de outubro de 2026. Dados conferidos em 26 de outubro de 2026, no skills.sh e no GitHub.

chromedevtools
chrome-devtools-cli
O Claude abre o site no Chrome, clica, preenche formulário, tira print e mede a velocidade com comandos de terminal que viram script.6.800 instalações, grátis

O que ela faz

Ensina o Claude a usar o chrome-devtools, a linha de comando do Chrome DevTools MCP, pra mexer no navegador direto do terminal. O fluxo é curto: lista as abas abertas, tira um retrato em texto da página pra achar cada botão e campo por um código, e então clica, preenche, arrasta ou passa o mouse.

Cobre navegação (abrir, recarregar sem cache, voltar), simulação de celular, rede lenta, modo escuro e localização, print da tela inteira ou de um elemento, gravação em mp4, lista de requisições de rede e mensagens do console, e execução de JavaScript na página.

Também mede desempenho: grava trace com a análise do LCP, roda auditoria do Lighthouse e captura a memória pra caçar vazamento. Como cada passo é um comando, dá pra juntar tudo num shell script e repetir a tarefa sempre que precisar.

Nas palavras de quem fez

Use this skill to write shell scripts or run shell commands to automate tasks in the browser or otherwise use Chrome DevTools via CLI.

chromedevtools, no SKILL.md

Quando usar

Conferir se o formulário de cadastro do site funciona depois de uma mudança
Tirar print da página inteira no tamanho do celular e no modo escuro
Rodar o Lighthouse e ver o que está atrasando a página
Achar a requisição que está dando erro no checkout
Montar um script que repete o mesmo passo a passo no navegador

Depois de instalar, é só pedir assim

Abre meusite.com.br no Chrome, preenche o formulário de contato com dados de teste e me diz se apareceu a mensagem de sucesso
Tira um print da página inteira em 390x844 e outro em 1920x1080
Roda o Lighthouse na home no modo celular e lista as três coisas que mais pesam

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

Gen Agent Trust HubAlerta
SocketPassou
SnykAlerta

Perguntas

Como instalar a Chrome Devtools CLI no Claude Code?

Toca em Levar, aqui nesta página, e deixa seu nome, e-mail e WhatsApp (é uma vez só). Aparece uma frase pronta: cola ela no Claude Code, que ele mesmo instala a Chrome Devtools CLI, e a skill passa a valer na próxima conversa. A mesma frase serve no Codex. Se preferir fazer na mão, o passo a passo está em como instalar skills no Claude Code.

O que precisa pra funcionar?

Node.js e o Chrome na máquina. Na primeira vez, instala o pacote com npm i chrome-devtools-mcp@latest -g e o comando chrome-devtools fica disponível. Não pede chave de API.

Roda no Codex e no Antigravity?

Sim. Tudo é comando de terminal, então funciona em qualquer agente que rode shell. É a versão de linha de comando do Chrome DevTools MCP, pra quem prefere script a ligar o MCP.

Ela acessa qualquer arquivo do computador?

Por padrão, sim: a CLI pode salvar print e trace e enviar arquivo de qualquer pasta. Pra limitar à pasta temporária do sistema, use a opção --allowUnrestrictedPaths=false.

Levar essa skill

1x chrome-devtools-cliR$ 0,00

TotalR$ 0,00

Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/chromedevtools/chrome-devtools-mcp

Aprenda a usar

Automação com IA: como montar e vender em 2026
O que é automação com IA na prática, diferença entre fluxo fixo e agente inteligente, ferramentas (n8n, Claude Code) e como vender para empresas.