Back

Como Abrir o Chrome DevTools: 4 Métodos Rápidos com Atalhos de Teclado

Como Abrir o Chrome DevTools: 4 Métodos Rápidos com Atalhos de Teclado

Por que os desenvolvedores perdem 11 segundos por sessão de depuração procurando o DevTools? Este guia mostra quatro maneiras confiáveis de abrir as ferramentas de desenvolvedor do Chrome, incluindo atalhos de teclado e acesso permanente à barra de ferramentas que persiste após reiniciar o navegador.

Principais Pontos

  • Use Ctrl+Shift+I (Windows/Linux) ou Cmd+Opt+I (Mac) para acesso instantâneo
  • Ative o acesso permanente à barra de ferramentas através das configurações do Chrome
  • Abra as ferramentas diretamente em painéis específicos como Elements ou Console

Método 1: Atalhos de Teclado (Mais Rápido)

Atalho principal:

  • Windows/Linux: Ctrl + Shift + I ou F12
  • Mac: ⌘ + ⌥ + I

Atalhos específicos para painéis:

  • Painel Elements: Ctrl + Shift + C (Windows) / ⌘ + ⌥ + C (Mac)
  • Painel Console: Ctrl + Shift + J (Windows) / ⌘ + ⌥ + J (Mac)

Método 2: Inspeção por Clique Direito

  1. Clique com o botão direito em qualquer elemento da página
  2. Selecione Inspecionar no menu de contexto

Método 3: Navegação pelo Menu do Chrome

  1. Clique em ⋮ (Mais Ferramentas)
  2. Navegue até Mais Ferramentas > Ferramentas do Desenvolvedor

Útil quando o teclado não está disponível

Método 4: Acesso Permanente à Barra de Ferramentas

Ative o DevTools na barra de ferramentas do Chrome para acesso com um clique:

  1. Abra uma nova janela
  2. Clique no botão Editar (ícone de caneta) no canto inferior direito
  3. Selecione Barra de Ferramentas no menu esquerdo
  4. Role para baixo e ative Ferramentas do Desenvolvedor

0

Perguntas Frequentes

Use o Método 4 para ativar o ícone na barra de ferramentas - ele persiste em todas as abas e janelas até ser desativado

Verifique se há extensões do navegador sobrepondo atalhos ou redefina os mapeamentos em chrome://settings/shortcuts

Sim - pressione Ctrl + Shift + J (Windows) ou ⌘ + ⌥ + J (Mac) para abrir o Console no modo gaveta

Sim - as configurações da barra de ferramentas se aplicam a todos os modos de navegação

Conclusão

Domine estes quatro métodos de ativação do DevTools para otimizar seu fluxo de trabalho de depuração. O novo alternador da barra de ferramentas (Método 4) fornece acesso persistente para usuários frequentes, enquanto os atalhos de teclado continuam sendo a opção mais rápida para usuários avançados. Para depuração específica de elementos, lembre-se que Ctrl/Cmd+Shift+C abre o painel Elements diretamente.

Listen to your bugs 🧘, with OpenReplay

See how users use your app and resolve issues fast.
Loved by thousands of developers