Firefox – Change the white background in webpages to another color

colorsfirefox

I'm currently using a dark theme in Firefox. It looks really nice, but many webpages use a plain white background. The resulting contrast is a little unpleasant and sometimes hurts the eye when I switch from a dark tab to a white tab.

Is there a way to make firefox replace white backgrouns everywhere with some other color (light gray, for instance)? It could be a Stylish script, a userChrome.css hack, or anything that works (preferably as light as possible).

To make myself clear: after I achieve my objective, the background color whenever I visit the Superuser site should be light-grey instead of white, and the same should happen to any other site with a white background (google sites, tech crunch, etc).

Is there a way to do that?

Best Answer

I just wrote a quick Greasemonkey script that checks the computed style of the body element and changes it to black (you probably want to choose a different colour):

(function () {
    if (window.getComputedStyle(document.body, null).getPropertyValue("background-color") == "rgb(255, 255, 255)") {
        console.log("Setting new background color...");
        document.body.setAttribute("style", "background-color: #000000;");
    }
})();

The problem with these types of things is that unless websites are designed extremely well, there will be blotches of white on black.

Related Question