Jump to content

Edit History

Juju

Juju

Just wanted to add a little something here. I found it surprising when you mentioned you didn't like dark themes because you're bound to run into something white when browsing the Internet and that's always unpleasant. I've been using dark themes everywhere for a few years now, and recently I ran into this same problem. I found an interesting solution, however.

 

There's an extension (for Firefox and Chrome, as far as I know) called TamperMonkey that can run simple scripts to change your browsing experience. With this, you can add custom code on a script to change the background on most sites. It doesn't work on all sites, of course, but it really makes things easier on the eyes.

 

If you want to try it out, add this to your browser, then create a new script, paste this:

Quote 

// ==UserScript==
// @id             noWhiteBackgroundColor-gray
// @name           noWhiteBackgroundColor-gray
// @version        2.0
// @namespace
// @author         HowardSmith
// @description    Version 2: Generic version which can now be configured to any background colour you like:
// @include        *
// @exclude
// @run-at         document-start
// ==/UserScript==
(function () {
    function noWhiteBackgroundColor() {

        function changeBackgroundColor(x)  {  // auto change colors too close to white
            var backgroundColorRGB=window.getComputedStyle(x,null).backgroundColor;  // get background-color
            if(backgroundColorRGB!="transparent")  {  // convert hex color to rgb color to compare
                var RGBValuesArray = backgroundColorRGB.match(/\d+/g); //get rgb values
                var red   = RGBValuesArray[0];
                var green = RGBValuesArray[1];
                var blue  = RGBValuesArray[2];

                // ============================================================================
                // Set the base colors you require:
                // use: http://www.colorpicker.com
                // to find the rgb values of the base colour you wish to suppress white backgrounds with:
                // Default gray provided:
                // ============================================================================

                var red_needed   = 220;
                var green_needed = 220;
                var blue_needed  = 220;


                if (red>=220&&green>=220&&blue>=220) {   // white range detection

                   if      (red>=250&&red<=255&&green>=250&&green<=255&&blue>=250&&blue<=255) {
                      red_needed   += 0;
                      green_needed += 0; }

                   else if (red>=240&&red<=255&&green>=240&&green<=255&&blue>=240&&blue<=255) {
                      red_needed   += 6;
                      green_needed += 3; }

                   else if (red>=230&&red<=255&&green>=230&&green<=255&&blue>=230&&blue<=255) {
                      red_needed   += 10;
                      green_needed += 5; }

                   else if (red>=220&&red<=255&&green>=220&&green<=255&&blue>=220&&blue<=255) {
                      red_needed   += 14;
                      green_needed += 7; }

                   x.style.backgroundColor="rgb( " +red_needed+ ", " +green_needed+ ", " +blue_needed+ ")"; // the background-color you want
                   }
                }
            }
        var allElements=document.getElementsByTagName("*");  // get all elements on a page
        for(var i=0; i<allElements.length; i++)  {
            changeBackgroundColor(allElements[i]);}
    }
    window.addEventListener("DOMContentLoaded",noWhiteBackgroundColor, false);
})() ;

 

 

Then you just save the script and refresh your browser windows. This will turn the white backgrounds into grey ones. It's still quite easy to read black text and I haven't had any problems with it so far; also, you can change the RGB colors to make it clearer or darker if you want to. It's a bit of a hack, but it's made my browsing way easier on the last few months.

Juju

Juju

Just wanted to add a little something here. I found it surprising when you mentioned you didn't like dark themes because you're bound to run into something white when browsing the Internet and that's always unpleasant. I've been using dark themes everywhere for a few years now, and recently I ran into this same problem. I found an interesting solution, however.

 

There's an extension (for Firefox and Chrome, as far as I know) called TamperMonkey that can run simple scripts to change your browsing experience. With this, you can add custom code on a script to change the background on most sites. It doesn't work on all sites, of course, but it really makes things easier on the eyes.

 

If you want to try it out, add this to your browser, then create a new script, paste this:

Quote 

// ==UserScript==
// @id             noWhiteBackgroundColor-gray
// @name           noWhiteBackgroundColor-gray
// @version        2.0
// @namespace
// @author         HowardSmith
// @description    Version 2: Generic version which can now be configured to any background colour you like:
// @include        *
// @exclude
// @run-at         document-start
// ==/UserScript==
(function () {
    function noWhiteBackgroundColor() {

        function changeBackgroundColor(x)  {  // auto change colors too close to white
            var backgroundColorRGB=window.getComputedStyle(x,null).backgroundColor;  // get background-color
            if(backgroundColorRGB!="transparent")  {  // convert hex color to rgb color to compare
                var RGBValuesArray = backgroundColorRGB.match(/\d+/g); //get rgb values
                var red   = RGBValuesArray[0];
                var green = RGBValuesArray[1];
                var blue  = RGBValuesArray[2];

                // ============================================================================
                // Set the base colors you require:
                // use: http://www.colorpicker.com
                // to find the rgb values of the base colour you wish to suppress white backgrounds with:
                // Default gray provided:
                // ============================================================================

                var red_needed   = 220;
                var green_needed = 220;
                var blue_needed  = 220;


                if (red>=220&&green>=220&&blue>=220) {   // white range detection

                   if      (red>=250&&red<=255&&green>=250&&green<=255&&blue>=250&&blue<=255) {
                      red_needed   += 0;
                      green_needed += 0; }

                   else if (red>=240&&red<=255&&green>=240&&green<=255&&blue>=240&&blue<=255) {
                      red_needed   += 6;
                      green_needed += 3; }

                   else if (red>=230&&red<=255&&green>=230&&green<=255&&blue>=230&&blue<=255) {
                      red_needed   += 10;
                      green_needed += 5; }

                   else if (red>=220&&red<=255&&green>=220&&green<=255&&blue>=220&&blue<=255) {
                      red_needed   += 14;
                      green_needed += 7; }

                   x.style.backgroundColor="rgb( " +red_needed+ ", " +green_needed+ ", " +blue_needed+ ")"; // the background-color you want
                   }
                }
            }
        var allElements=document.getElementsByTagName("*");  // get all elements on a page
        for(var i=0; i<allElements.length; i++)  {
            changeBackgroundColor(allElements[i]);}
    }
    window.addEventListener("DOMContentLoaded",noWhiteBackgroundColor, false);
})() ;

 

 

This will turn the white backgrounds into grey ones. It's still quite easy to read black text and I haven't had any problems with it so far; also, you can change the RGB colors to make it clearer or darker if you want to. It's a bit of a hack, but it's made my browsing way easier on the last few months.

Juju

Juju

Just wanted to add a little something here. I found it surprising when you mentioned you didn't like dark themes because you're bound to run into something white when browsing the Internet and that's always unpleasant. I've been using dark themes everywhere for a few years now, and recently I ran into this same problem. I found an interesting solution, however.

 

There's an extension (for Firefox and Chrome, as far as I know) called TamperMonkey that can run simple scripts to change your browsing experience. With this, you can add custom code on a script to change the background on most sites. It doesn't work on all sites, of course, but it really makes things easier on the eyes.

 

If you want to try it out, add this to your browser, then create a new script, paste this: 

// ==UserScript==
// @id             noWhiteBackgroundColor-gray
// @name           noWhiteBackgroundColor-gray
// @version        2.0
// @namespace
// @author         HowardSmith
// @description    Version 2: Generic version which can now be configured to any background colour you like:
// @include        *
// @exclude
// @run-at         document-start
// ==/UserScript==
(function () {
    function noWhiteBackgroundColor() {

        function changeBackgroundColor(x)  {  // auto change colors too close to white
            var backgroundColorRGB=window.getComputedStyle(x,null).backgroundColor;  // get background-color
            if(backgroundColorRGB!="transparent")  {  // convert hex color to rgb color to compare
                var RGBValuesArray = backgroundColorRGB.match(/\d+/g); //get rgb values
                var red   = RGBValuesArray[0];
                var green = RGBValuesArray[1];
                var blue  = RGBValuesArray[2];

                // ============================================================================
                // Set the base colors you require:
                // use: http://www.colorpicker.com
                // to find the rgb values of the base colour you wish to suppress white backgrounds with:
                // Default gray provided:
                // ============================================================================

                var red_needed   = 220;
                var green_needed = 220;
                var blue_needed  = 220;


                if (red>=220&&green>=220&&blue>=220) {   // white range detection

                   if      (red>=250&&red<=255&&green>=250&&green<=255&&blue>=250&&blue<=255) {
                      red_needed   += 0;
                      green_needed += 0; }

                   else if (red>=240&&red<=255&&green>=240&&green<=255&&blue>=240&&blue<=255) {
                      red_needed   += 6;
                      green_needed += 3; }

                   else if (red>=230&&red<=255&&green>=230&&green<=255&&blue>=230&&blue<=255) {
                      red_needed   += 10;
                      green_needed += 5; }

                   else if (red>=220&&red<=255&&green>=220&&green<=255&&blue>=220&&blue<=255) {
                      red_needed   += 14;
                      green_needed += 7; }

                   x.style.backgroundColor="rgb( " +red_needed+ ", " +green_needed+ ", " +blue_needed+ ")"; // the background-color you want
                   }
                }
            }
        var allElements=document.getElementsByTagName("*");  // get all elements on a page
        for(var i=0; i<allElements.length; i++)  {
            changeBackgroundColor(allElements[i]);}
    }
    window.addEventListener("DOMContentLoaded",noWhiteBackgroundColor, false);
})() ;

This will turn the white backgrounds into grey ones. It's still quite easy to read black text and I haven't had any problems with it so far; also, you can change the RGB colors to make it clearer or darker if you want to. It's a bit of a hack, but it's made my browsing way easier on the last few months.

×
×
  • Create New...

This website uses cookies, as do most websites since the 90s. By using this site, you consent to cookies. We have to say this or we get in trouble. Learn more.

  I accept