Tema escuro no DevTools do Chrome

Dark Theme no DevTools

Que tal deixar o seu DevTools com o tema escuro?

Sobre esse tipo de artigo

Todo dia aprendemos alguma coisa. Seja através de um bug, seja lendo artigos, seja conversando com as pessoas.

Ontem por exemplo, postei no Fórum Front-End BR no Github uma dica para resolver o problema do position: fixed, em dispositivos mobile.

Acabei chegando a conclusão, que talvez seja melhor postar esse tipo de informação no meu site. Então, sempre que tiver uma dica simples e rápida, vou mostra-lá aqui.

Dark Theme no DevTools??

Não importa se você usa Sublime, Atom ou o Vim caso seja um gênio igual o Matheus Marsiglio, a chance de você estar usando um tema escuro nesses editores é enorme.

Além disso, você provavelmente usa linha de comando, e provavelmente o tema também é escuro.

Nada pior do que viciar o olhar nesses temas escuros, mudar a janela para o o Dev Tools e ver aquele tema branco, certo?

Tenho certeza que você ia achar bem melhor que o DevTools do Chrome fosse assim:

Tema escuro do DevTools no Chrome

Ou assim no Firefox:

Tema escuro do DevTools no Firefox

E isso é muito simples!

Como mudar o tema

No Chrome

  1. No canto superior direito do DevTools. Configurações do DevTools do Chrome

  2. Depois vá em settings e selecione Theme: Dark. Configurações de tema do DevTools do Chrome

Firefox

  1. No canto superior direito do DevTools, clique no botão de engrenagem.
  2. Depois vá em Temas e selecione tema escuro.

Configurações de tema do DevTools do Firefox


Essa dica foi dada pelo Diogo Moretti, acredito que a maioria já saiba, mas fica o registro para quem ainda não conhece essa opção.

Nóis!