Mude o tema do Chrome Developer Tools

12:14

Como desenvolvedor web, sempre utilizamos ferramentas que auxiliam em nossos projetos. Entre elas, a que mais se destaca é o Chrome Developer Tools.

Apenas apertando a tecla F12, conseguimos ter acesso ao console da página, registro de erros, código fonte, mudar completamente o estilo da página, tempo e banda do carregamento de cada elemento, entre várias outras funções. O Developer Tools é uma ótima ferramenta, indispensável para qualquer projeto web.

Encontramos um artigo no blog howchoo que ensina a aplicar o tema Dark em nossa ferramenta, ideal para quem quer deixar o console com sua cara. Os passos a seguir ensina aplicar o tema Zero Dark Matrix.

Para novos aventureiros, siga estritamente esses passos.

 

Passo 1: ativar a opção Developer Tools Experiments

Pela barra de endereço, acesse chrome://flags. Role a página um pouco para baixo e procure pela opção “Ativar experiências das Ferramentas do desenvolvedor”. Ative-a e reinicie seu navegador (feche e abra novamente).

passo1

 

Passo 2: ativar UI Themes personalizados.

Aperte F12 para abrir seu Developer Tools. Click no ícone Settings (um ícone de engrenagem, na parte de cima na direita), selecione “Experiments” e marque a opção “Allow custom UI themes”. Feche a ferramenta em seguida.

passo2

 

Passo 3: baixe um tema

Nesse tutorial usaremo o tema DevTools Theme: Zero Dark Matrix. Click aqui para baixar-lo pela Chrome Web Store. O tema será baixado como uma extensão do navegador. Baixe o tema e ative-o.

passo3

 

Passo 4: abra seu Developer Tools

Pronto! Você acaba de aplicar uma tema “Dark” ao seu Developer Tools.

passo4

 

Existem diversos temas para serem aplicados, recomendamos também os temas greybeard e Flatland. Se você achou mais algum tema interessante, compartilhe-o com seu comentário abaixo.