Alterar o plano de fundo da nova guia do Firefox

Eu sempre uso o tema personas escuras ou o tema escuro compacto padrão incluído no Firefox e não gosto da cor de fundo padrão ser branca quando abro uma nova guia. Usei um complemento que me permitia personalizar novas abas, mas agora o Firefox 57 se foi ...

Então, como posso mudar o plano de fundo de novas guias?

Eu acho que isso pode interessar aos outros também. Até agora, conheço alguns addons para conseguir isso e uma maneira de ficar sem addons (como parece que muitos deles estão desaparecendo dia a dia), aqui vamos nós:

1. Personalize about: newtab (veja o ponto 3 abaixo)

   Este é um complemento específico para a tarefa, não apenas permite alterar a cor do plano de fundo, mas também escolher uma imagem de plano de fundo e também redimensioná-la e alinhá-la como desejar ... legal!

2. Elegante (veja o ponto 3 abaixo)

   Elegante é um complemento com um espectro mais amplo de funcionalidades; permite que você personalize o próprio Firefox, desde que gerencie / instale temas e skins para muitos sites populares, como Google, Facebook, YouTube e muitos outros ... Acho que é um exagero se você precisar apenas para a tarefa que estamos lidando aqui .

3. Nenhuma das opções acima funcionará com o Firefox 57 devido a restrições adicionais . A caneta stylus com a nova aba do Firefox 57 mostra esta mensagem:

   Como medida de segurança, o navegador proíbe as extensões de afetar suas páginas internas (como chrome: // version, a nova página de guia padrão do Chrome 61, sobre: ​​addons etc.), bem como as páginas de outras extensões. Cada navegador também restringe o acesso a sua própria galeria de extensões (como Chrome Web Store ou AMO).

   Então, vamos deixar os addons de lado e sujar as mãos!

   Você pode decidir que não deseja usar um complemento para isso, bem, neste caso, eis o que fazer:

   • escreva about:profilesna barra de endereços do Firefox e selecione Open Folderem correspondência o "Diretório Raiz" do perfil do usuário que você deseja personalizar (geralmente há apenas um);

   • a pasta raiz do perfil já deveria estar aberta, crie (se ainda não estiver presente) uma nova pasta chamada chrome;

   • crie (se ainda não estiver presente) um novo arquivo nomeado userContent.css dentro da chromepasta e insira o seguinte código:

     @-moz-document url("about:newtab") {  
         body {
             background-color: #000000 !important;
         }
     }

   Se você pode manipular o CSS, também pode adicionar algum código para definir uma imagem de plano de fundo, se quiser (sugiro que as imagens sejam colocadas na mesma pasta do CSS).

   Pode ser necessário reiniciar o Firefox para aplicar a personalização.

   Os créditos para este último ponto vão para DIENER_

Abra about:confige altere o valor browser.display.background_colorpara a cor de sua escolha. Estou usando o # 595959 (cinza neutro).

Isso funciona com a guia em branco ou "Firefox Home".

Infelizmente, abrir a guia rapidamente ou quando o navegador estiver com carga pesada ainda resultará em um flash branco.

Se você não sabe usar about: config, leia https://support.mozilla.org/pt-BR/kb/about-config-editor-firefox

Bem, devo dizer que a solução dada pelo @danicotra funciona para uma nova guia, mesmo com o Firefox 57. No entanto, durante o carregamento de uma página, um flash em branco ainda queima sistematicamente seus olhos.

Aqui está outra proposta de conteúdo para o seu ~/.mozilla/firefox/xxxxxxxx.default/chrome/userContent.css, que escurece mais alguns lugares, mas não resolve o flash em branco no carregamento.

/* https://userstyles.org/styles/90565/firefox-adjust-white-flash-when-opening-new-tab */
/* https://userstyles.org/styles/142191/remove-new-tab-flash */
@-moz-document url-prefix(about:preferences), url-prefix(about:blank), url-prefix(about:newtab) {
  html, body, #newtab-customize-overlay {
    background: #303030 !important;
    color: #b2b2b2 !important;
  } 
}

@-moz-document url(chrome://browser/content/browser.xul)
{

  browser[type="content-primary"]
  {
    background: #303030 !important;
    color: #b2b2b2 !important;
  }
}

@-moz-document url(chrome://browser/content/browser.xul)
{

  browser[type="content-primary"], tabbrowser tabpanels, #appcontent > #content
  {
    background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed !important;
    color: #b2b2b2 !important;
  }
}

@-moz-document url(about:blank),
               url(about:preferences),
               url(about:config),
               url(about:newtab)
{
  #newtab-window,
  html,
  body, 
  #newtab-customize-overlay 
  {
    background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed;
    color: #b2b2b2 !important;
  }
}

html>body {
  background: #303030 !important;
  color: #b2b2b2 !important;
}

Eu gosto da opção do psico-escravo, mas se você não quiser alterar o plano de fundo do google ou o plano de fundo desses sites, use o plano de fundo padrão do navegador para alterar as três últimas linhas como esta:

#root{   background: #303030 !important;   color: #b2b2b2 !important; } 

E aqui está o código completo, copiado da resposta do psicoslave.

>     /* https://userstyles.org/styles/90565/firefox-adjust-white-flash-when-opening-new-tab
> */ /* https://userstyles.org/styles/142191/remove-new-tab-flash */ @-moz-document url-prefix(about:preferences), url-prefix(about:blank),
> url-prefix(about:newtab) {   html, body, #newtab-customize-overlay {
>     background: #303030 !important;
>     color: #b2b2b2 !important;   }  }
> 
> @-moz-document url(chrome://browser/content/browser.xul) {
> 
>   browser[type="content-primary"]   {
>     background: #303030 !important;
>     color: #b2b2b2 !important;   } }
> 
> @-moz-document url(chrome://browser/content/browser.xul) {
> 
>   browser[type="content-primary"], tabbrowser tabpanels, #appcontent >
> #content   {
>     background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed
> !important;
>     color: #b2b2b2 !important;   } }
> 
> @-moz-document url(about:blank),
>                url(about:preferences),
>                url(about:config),
>                url(about:newtab) {   #newtab-window,   html,   body,    #newtab-customize-overlay    {
>     background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed;
>     color: #b2b2b2 !important;   } }
> 
> #root {   background: #303030 !important;   color: #b2b2b2 !important; }