Firefox dark background / theme for new tab and loading screen

firefox_dark_background.md

Firefox Dark Background

• How to change the background on Firefox to a dark one on new tab / loading screen ?

Procedure

• Type about:config in the URL bar
• Search toolkit.legacyUserProfileCustomizations.stylesheets and double-click the field to set it to true
• 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

@Arian04 That's reasonable troubleshooting advice, but I already use userchrome.css and usercontent.css, so I can definitely tell that they're working. And I don't see any styles in there that would obviously conflict with the code here, either.

@e-t-l hmm, just to rule out anything in your entire profile causing problems, maybe try this change on a fresh Firefox profile and see if it works there?

edit: by the way, which sites do you notice this behavior in? bc I've noticed it with Pearson's sites and I think it's because the site loads an intentionally white page before the content loads (and somehow dark reader isn't catching it) because I have noticeable black loading screens on all other sites.

I notice that when I left click a link that opens in a new tab, the white flash happens. Sometimes left click opens the link in the current tab, but sometimes it's into a new tab (such as links from a Google search). However if I press ctrl+click to purposely open links into a new tab then there is no white flash. This is with dark mode enabled, and it's been tested on a fresh install of Firefox. So try use ctrl+click as often as possible until there's a proper fix I reckon.

Actually in order to avoid seeing the flash, if I can't prevent it from happening, I've set the following prefs (for Firefox) to true:

• browser.tabs.loadInBackground
• browser.tabs.loadBookmarksInBackground
• browser.tabs.loadDivertedInBackground

As long as I wait at least one second before switching to the new tab, I won't see the white flash.

It's great, and the latest version (119.0.1) on Windows works. Thanks also to e-t-l(@e-t-l ) for the additional notes. Totally black looks good on the eyes.

"Dark Background and Light Text" add-on helps me. Maybe you can try it.

…

On Mon, Jan 15, 2024 at 6:23 AM parMaster ***@***.***> wrote: ***@***.**** commented on this gist. ------------------------------ Unfortunately, none of the above helped, I can still consistently reproduce (for almost a year now) white flash on multiple os/devices/versions. I even changed background color (about:preferences > Colors > Background) to grey - the flash is shorter, but it's still there - completely blinding, seizure inducing, white background before it turns grey. It happens 100% times when I click on a link in google search results page, when it loads the blank page which redirects you to the url. — Reply to this email directly, view it on GitHub <https://gist.github.com/gmolveau/a802ded1320a7591a289fb7abd0d6c45#gistcomment-4831713> or unsubscribe <https://github.com/notifications/unsubscribe-auth/AQEGBYM3XJH6NTYXGBLYBQ3YOUNVZBFKMF2HI4TJMJ2XIZLTSKBKK5TBNR2WLJDUOJ2WLJDOMFWWLO3UNBZGKYLEL5YGC4TUNFRWS4DBNZ2F6YLDORUXM2LUPGBKK5TBNR2WLJDHNFZXJJDOMFWWLK3UNBZGKYLEL52HS4DFVRZXKYTKMVRXIX3UPFYGLK2HNFZXIQ3PNVWWK3TUUZ2G64DJMNZZDAVEOR4XAZNEM5UXG5FFOZQWY5LFVA4TINRRGY2DOONHORZGSZ3HMVZKMY3SMVQXIZI> . You are receiving this email because you are subscribed to this thread. Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub> .

Deleted my previous comment, because I found a solution and wanted to tried it out on different devices and OS's. So, in my case the white flashes reappeared on some computers, although all the settings were still there. This helped:

Menu -> Help -> Troubleshoot mode

after it restarts in troubleshoot mode, go back to normal mode

Menu -> Help -> Turn Troubleshoot Mode off

It's still flashing, but with the color which set with "browser.display.background_color" parameter, which can be set in Settings, actually:

about:preferences#general -> Manage Colors -> background

However, I hate doing this dance on every machine I use

Works great with latest Firefox 122.0 - thank you :)!