O Chrome DevTools é um conjunto de ferramentas para desenvolvedores da Web integrado diretamente ao navegador Google Chrome. O DevTools permite editar páginas e diagnosticar problemas com rapidez, o que ajuda a criar sites melhores em menos tempo.
Começar Notas da versão

Depurar com IA

Saiba como as inovações de IA no DevTools permitem que você faça mais, mais rápido. Use DevTools para agentes para conectar o poder do DevTools aos seus agentes de programação favoritos.
Deixe o Gemini ajudar você a analisar e melhorar o estilo, a rede, as fontes e a performance do seu site. Receba ajuda com erros do console e sugestões de código nos painéis "Console" e "Fontes".
Conheça as inovações de IA
Ofereça aos seus agentes de programação as mesmas ferramentas confiáveis que você usa para inspecionar a atividade de rede, gravar rastros e solucionar problemas de aplicativos da Web no fluxo de trabalho de IA.

Conecte o servidor MCP do Chrome DevTools (Protocolo de Contexto de Modelo) à ferramenta de sua preferência: Antigravity, Claude Code, Cline, Copilot e muito mais.

Saiba mais
Ter uma visão abrangente e útil da performance da sua página.
Saiba como inspecionar os recursos carregados pela página e editá-los no navegador.
Analise e substitua as solicitações e respostas de rede em tempo real.

Dicas de ferramentas para desenvolvedores

Confira nossa série mensal de vídeos que mostra cenários comuns de depuração no DevTools de uma forma divertida.
Com o Chrome DevTools para agentes, seu agente pode verificar layouts responsivos, testar APIs com reconhecimento de local e simular várias velocidades de CPU ou de rede.
O Lighthouse no Chrome DevTools para agentes permite que seu agente de programação avalie a qualidade do site realizando verificações de integridade em tempo real para acessibilidade, SEO, práticas recomendadas e navegação agêntica.
Faça um tour pelo painel "Performance" atualizado, que mostra como medir as Core Web Vitals (LCP, CLS, INP) e receber conselhos personalizados do Gemini.
Navegue com o DevTools e vire um pirata da depuração! Descubra técnicas para emular estilos de foco, testar formulários com preenchimento automático e resolver erros de back-end com substituições de rede.

Receber insights de desempenho

Uma ampla variedade de ferramentas para medir e otimizar diferentes aspectos do desempenho de execução: o painel "Performance", o Lighthouse e muito mais.
Saiba mais sobre todos os recursos do painel "Performance": como gravar um rastro de performance, como visualizar e analisar o rastro e muito mais.
Conheça os novos recursos das Ferramentas do desenvolvedor, como a calibração de limitação de CPU, para ajudar você a basear suas decisões de depuração de desempenho em dados do mundo real
Conheça os novos insights de desempenho e o poder do Lighthouse diretamente no painel de desempenho do DevTools.

Notícias e atualizações

Inspecionar e editar recursos

Saiba mais sobre todos os recursos do painel "Fontes": como visualizar e editar arquivos, depurar JavaScript e configurar um espaço de trabalho.
Começar
O Workspace permite salvar as alterações feitas no DevTools no código-fonte armazenado no computador. Saiba como configurar um espaço de trabalho nos seus projetos.
Leia o tutorial

Analisar a atividade de rede

Saiba mais sobre todos os recursos do painel de rede: inspecione corpos de resposta e de solicitação, substitua cabeçalhos e muito mais.
Começar
Um tutorial prático para orientar você em tarefas comuns no painel de rede.
Leia o tutorial

Mais ferramentas

Conheça todos os outros recursos e capacidades do DevTools.
Saiba como visualizar e mudar o DOM de uma página.
Saiba como visualizar e mudar o CSS de uma página.
Acompanhar alterações em HTML, CSS e JavaScript.
Registre mensagens e execute o JavaScript.
Avaliar a performance do site
Encontre problemas de memória que afetam o desempenho da página, incluindo vazamentos de memória e muito mais.
Inspecione, modifique e depure apps da Web, teste o cache, visualize o armazenamento e muito mais.
Inspecione e modifique animações.
Gravar, repetir, medir os fluxos de usuários e editar as etapas.
Descubra um conjunto de opções que afetam a renderização de conteúdo da Web.
Inspecione e depure endereços salvos.
Encontre e corrija problemas no seu site.
A página precisa estar totalmente protegida por HTTPS.
Confira informações e depure players de mídia por guia do navegador.
Emular sensores do dispositivo.
Emular autenticadores.