X
Tap here to go to the mobile version of the site.
An updated version of Firefox is available to address the issues with Add-ons disabled or fail to install on Firefox. You can download the update for your OS here: https://www.mozilla.org/firefox/new/ For Known Issues and Workarounds, please check out the update at https://support.mozilla.org/kb/add-ons-disabled-or-fail-to-install-firefox

Support Forum

make everything dark in firefox

Posted

Hi, I'm trying to get as much as possible of firefox to use dark theme to save my eyes at night.

I use https://addons.mozilla.org/en-US/firefox/addon/darkreader/ to customize the sites automatically and it does an excellent job, except that firefox pages can't be customized with it and by that I mean:

about:blank about:newtab about:config about:preferences

for the blank and newtab pages I found three solutions:

1- create a [userContent.css](http://kb.mozillazine.org/UserContent.css) file with the following

@-moz-document url-prefix(about:blank) {*{background-color:#000000;}}

@-moz-document url-prefix(about:newtab) {*{background-color:#000000;}}

2- go to about:config and change

browser.display.background_color to #000000

browser.display.foreground_color to #ffffff

3- Go to "Preferences" and search for "colors" click on the colors button and set the background and text colors to the same colors as in 2.

now I tried all of the solutions above and all of them have side effects, the most prominent and annoying one is flashing white page for a couple of seconds when opening a new tab or white page while the website, other annoyances is that the settings don't apply to about:config and about:preferences even if I add them in userContent.css

-To test the flashing white you only need to open a new tab (while applying my settings above) and you will see it.

-To the white page before the site is loaded you need to open the link from another page(if you open a new tab and then paste the link you won't get the white page since the about:blank or about:newtab will have the dark background)

so to see my problem do the following:

1- go to https://github.com/biesiad/deelay#deelayme

2- right click on deelay.me link and click "open link in a new tab"

the link will be opened in a new tab that has the background in white or grayish color.

How can I solve these problems ? any tip would be appreciated.

Regards

Hi, I'm trying to get as much as possible of firefox to use dark theme to save my eyes at night. I use https://addons.mozilla.org/en-US/firefox/addon/darkreader/ to customize the sites automatically and it does an excellent job, except that firefox pages can't be customized with it and by that I mean: about:blank about:newtab about:config about:preferences for the blank and newtab pages I found three solutions: 1- create a [userContent.css](http://kb.mozillazine.org/UserContent.css) file with the following @-moz-document url-prefix(about:blank) {*{background-color:#000000;}} @-moz-document url-prefix(about:newtab) {*{background-color:#000000;}} 2- go to about:config and change browser.display.background_color to #000000 browser.display.foreground_color to #ffffff 3- Go to "Preferences" and search for "colors" click on the colors button and set the background and text colors to the same colors as in 2. now I tried all of the solutions above and all of them have side effects, the most prominent and annoying one is flashing white page for a couple of seconds when opening a new tab or white page while the website, other annoyances is that the settings don't apply to about:config and about:preferences even if I add them in userContent.css -To test the flashing white you only need to open a new tab (while applying my settings above) and you will see it. -To the white page before the site is loaded you need to open the link from another page(if you open a new tab and then paste the link you won't get the white page since the about:blank or about:newtab will have the dark background) so to see my problem do the following: 1- go to https://github.com/biesiad/deelay#deelayme 2- right click on deelay.me link and click "open link in a new tab" the link will be opened in a new tab that has the background in white or grayish color. How can I solve these problems ? any tip would be appreciated. Regards

Modified by moham96

Chosen solution

You could borrow from or adopt the userContent.css file (possibly also userChrome.css) in this project:

https://overdodactyl.github.io/ShadowFox/

Read this answer in context 1
Quote
MickvdMeijde 6 solutions 77 answers

Hello moham 09,

In Firefox there is a built-in dark theme which darkens the about:newpage. about:preferences will however always remain white

Hello moham 09, In Firefox there is a built-in dark theme which darkens the about:newpage. about:preferences will however always remain white
Was this helpful to you?
Quote

Question owner

MickvdMeijde said

Hello moham 09, In Firefox there is a built-in dark theme which darkens the about:newpage. about:preferences will however always remain white

I'm already using that theme and it doesn't make the about:newtab dark

''MickvdMeijde [[#answer-1207149|said]]'' <blockquote> Hello moham 09, In Firefox there is a built-in dark theme which darkens the about:newpage. about:preferences will however always remain white </blockquote> I'm already using that theme and it doesn't make the about:newtab dark
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8315 solutions 68040 answers

Chosen Solution

You could borrow from or adopt the userContent.css file (possibly also userChrome.css) in this project:

https://overdodactyl.github.io/ShadowFox/

You could borrow from or adopt the userContent.css file (possibly also userChrome.css) in this project: https://overdodactyl.github.io/ShadowFox/
Was this helpful to you? 1
Quote
jscher2000
  • Top 10 Contributor
8315 solutions 68040 answers

Helpful Reply

Sorry, I didn't read your original question carefully enough. Do you already have a userChrome.css file with a default "empty tab" color? I think you will need that to supplement your page coloring rules. Definitely check out ShadowFox.

Sorry, I didn't read your original question carefully enough. Do you already have a userChrome.css file with a default "empty tab" color? I think you will need that to supplement your page coloring rules. Definitely check out ShadowFox.
Was this helpful to you? 1
Quote

Question owner

jscher2000 said

You could borrow from or adopt the userContent.css file (possibly also userChrome.css) in this project: https://overdodactyl.github.io/ShadowFox/

Thanks, I've never heard of ShadowFox before, it solved my issues. Now I need to read the css and customize to my liking

''jscher2000 [[#answer-1208589|said]]'' <blockquote> You could borrow from or adopt the userContent.css file (possibly also userChrome.css) in this project: https://overdodactyl.github.io/ShadowFox/ </blockquote> Thanks, I've never heard of ShadowFox before, it solved my issues. Now I need to read the css and customize to my liking
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.