To reduce eye strain at night, I use the dark mode plugin for Firefox. However, even when the firefox theme is set to dark, there is a flash of white light before the dark mode activates due to the new UI change in Firefox. I searched Reddit for a solution and came across this.
Dark Reader extension: https://darkreader.org/ https://addons.mozilla.org/en-US/firefox/addon/darkreader/
Solution 1:
Go to “about:config” in Firefox and set browser.display.background_color to a darker colour, say #2E2E31.
Solution 2:
Firefox settings – type “color” in the search field, click “Colors…” and uncheck “Use system colors”, restart the browser.
Solution 3:
- Type
about:config
in the URL bar - Search
toolkit.legacyUserProfileCustomizations.stylesheets
and double-click the field to set it totrue
- Type
about:support
in the URL bar - Look for
Profile folder
field and click on the open button next to it. - Create a folder with the name
chrome
- Inside this folder, create a file
userChrome.css
and paste the following code inside it :
tabbrowser tabpanels { background-color: rgb(19,19,20) !important; }
browser { background-color: #131314 !important; }
- Then create another file
userContent.css
and paste the followind code in it :
@-moz-document url-prefix(about:blank) {
html > body:empty {
background-color: rgb(19,19,20) !important;
}
}
@-moz-document url(about:blank) {
html > body:empty {
background-color: rgb(19,19,20) !important;
}
}
-
Completely quit and restart firefox
-
Enjoy
Solution 4:
browser.in-content.dark-mode
set to dark
ui.systemUsesDarkTheme
set to 1
also try to increase number nglayout.initialpaint.delay
from 5
to 3000
personally I set to 5000
If white flash still appears, try to add custom userContent.css
@namespace url("http://www.w3.org/1999/xhtml");
@-moz-document url("about:home"),
url("about:blank"),
url("about:newtab") {
body {
background-color: #1c1b22 !important;
}
}
Sometimes a White Flash appears if you set privacy.resistFingerprinting = true
because Since FF67, when enabled, will always return light