X
Tap here to go to the mobile version of the site.

Support Forum

Change Firefox background when navigating pages

Posted

Hi

I have dark mode installed for almost every site that I use.

When I navigate from one page to the other the background of Firefox is set to the white color, and switching from black to white, and immediately back to black is aggressive to the eyes.

How can I change the background color of Firefox before the page has loaded?

Thanks.

Hi I have dark mode installed for almost every site that I use. When I navigate from one page to the other the background of Firefox is set to the white color, and switching from black to white, and immediately back to black is aggressive to the eyes. How can I change the background color of Firefox before the page has loaded? Thanks.

Chosen solution

Could I suggest asking about the problem on the Github site? Giving specific page examples for comparison might help.

https://github.com/overdodactyl/ShadowFox/issues

Read this answer in context 0
Quote

Additional System Details

Application

  • User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:67.0) Gecko/20100101 Firefox/67.0

More Information

jscher2000
  • Top 10 Contributor
8577 solutions 70121 answers

Helpful Reply

Hi epomatti, the empty frame that the web content goes into normally has a white background. Traditionally, you would create a userChrome.css file to apply a custom background color. It sounds as though Firefox's Dark theme doesn't do that yet, and it still needs to be done the old-fashioned way.

There is a project called ShadowFox that includes this and numerous other style rules to dark theme as much of Firefox as possible: https://overdodactyl.github.io/ShadowFox/

If you don't want to use all of that, just the one change, I could figure out which rule it is, or you could check the following subreddit where the question comes up from time to time: https://www.reddit.com/r/FirefoxCSS/

Hi epomatti, the empty frame that the web content goes into normally has a white background. Traditionally, you would create a '''userChrome.css''' file to apply a custom background color. It sounds as though Firefox's Dark theme doesn't do that yet, and it still needs to be done the old-fashioned way. There is a project called ShadowFox that includes this and numerous other style rules to dark theme as much of Firefox as possible: https://overdodactyl.github.io/ShadowFox/ If you don't want to use all of that, just the one change, I could figure out which rule it is, or you could check the following subreddit where the question comes up from time to time: https://www.reddit.com/r/FirefoxCSS/
Was this helpful to you? 1
Quote

Question owner

Hi Jscher

I installed it but there still is a small gap where (I assume) the page CSS is not loaded yet, and the background of the page is white for a short second.

Can that be changed as well?

Hi Jscher I installed it but there still is a small gap where (I assume) the page CSS is not loaded yet, and the background of the page is white for a short second. Can that be changed as well?
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8577 solutions 70121 answers

Chosen Solution

Could I suggest asking about the problem on the Github site? Giving specific page examples for comparison might help.

https://github.com/overdodactyl/ShadowFox/issues

Could I suggest asking about the problem on the Github site? Giving specific page examples for comparison might help. https://github.com/overdodactyl/ShadowFox/issues
Was this helpful to you?
Quote
cor-el
  • Top 10 Contributor
  • Moderator
17343 solutions 156777 answers

Try to add code to the userContent.css file.


/* about:blank */
@-moz-document url(about:blank){html,body{background-color:#ddd!important}}
Try to add code to the <b>userContent.css</b> file. *http://kb.mozillazine.org/userContent.css <hr> <pre><nowiki>/* about:blank */ @-moz-document url(about:blank){html,body{background-color:#ddd!important}} </nowiki></pre> *https://www.userchrome.org/what-is-userchrome-css.html *https://www.userchrome.org/how-create-userchrome-css.html
Was this helpful to you? 0
Quote

Question owner

cor-el said

Try to add code to the userContent.css file.
/* about:blank */
@-moz-document url(about:blank){html,body{background-color:#ddd!important}}

It didn't work.

''cor-el [[#answer-1229978|said]]'' <blockquote> Try to add code to the <b>userContent.css</b> file. *http://kb.mozillazine.org/userContent.css <hr> <pre><nowiki>/* about:blank */ @-moz-document url(about:blank){html,body{background-color:#ddd!important}} </nowiki></pre> *https://www.userchrome.org/what-is-userchrome-css.html *https://www.userchrome.org/how-create-userchrome-css.html </blockquote> It didn't work.
Was this helpful to you?
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.