How to change the color of web pages before they load
So, I am yet another person asking about how to change the background colors so that I am not blinded by the flash of unstyled content. I have tried a custom userChrome file, ShadowFox, addons, and changing the display color in the about:config page. None of these have fixed the problem. Using them, I have made myself a dark theme that even works on browser pages. Now the problem is that the flash of unstyled content is white, and thus it hurts my eyes whenever I load a page. At this point, I have downloaded the source code, and am hoping the find the relevant section that would make the background black, so that for that split second where the css has not loaded, I do not have to see a white flash.
I am using Firefox Developer Edition. I have already enabled the dark theme, and at this point my only hope left is the source code. Can anyone point me to the file that controls the main background color for pages that have not loaded yet?
All Replies (8)
Shadowfox should work when getting rid of the "white flash" before the load of new pages. I have been using it since it came out and its worked flawlessly across OSes.
My userChrome file is a mixture of Shadowfox, copied/pasted from /r/firefox, and my own CSS. I currently use .tabbrowser-tabbox { background-color: #323234; } to get rid of the flash.
Unfortunatly, while shadowfox works to change the browser pages, it does not solve the flash problem for me. Is there a configuration I need to do for it?
My preload flash is still white, even with shadowfox and a combination of about 5 different solutions people have used in my userChrome file.
I have the same problem, did you find a fix yet?
I wish. I've come to believe that it has to do with the way in which web pages are loaded. They need to load the user styles earlier, otherwise you get the flash in that brief second in which the webpage is loading but your style has not. I don't think there is a fix, since I have tried everything anyone has suggested and the problem remained. We will have to wait it out.
The userChrome.css part of the equation can fill the empty content area with a dark background, but if the site itself uses a light background color, there definitely is a delay before that gets restyled. I assume that is where the problem is occurring.
Perhaps it would make sense to impose a visibility delay on newly loading tabs (if that's possible)? You've probably seen sites that "fade in" their content using their own built-in rules. Taking that inspiration, the idea would be to fade in the page after a delay, either based on a standard amount of time, or if possible based on the completion of loading (i.e., when the ping-ponging dot on the tab has stopped and been replaced by the site icon).
I wonder if the author of ShadowFox could add something like that?
The problem does stem from the fact that the site itself uses a light background, so it seems that for now this problem is beyond our capabilities to fix.
Maybe is within firefox dev's capabilites? Was this suggested to the devs anywhere?
To OP, I suggest you use Shadowfox (https://overdodactyl.github.io/ShadowFox/) in addition with the extension Dark Background and Light Text for a more seamless transition into total dark mode. Using those two has greatly reduced the amount of white I see. Since all sites' background colors are now turned dark thanks to DBLT, the white flash is no longer an issue.