Google-chrome – way to invert the colors of the images only in Chrome

accessibilitygoogle-chromegoogle-chrome-extensions

I've inverted the colors for everything on my Mac, which makes it much easier to read text. The only downside is the images. It would be nice if there were a way to invert only the pictures in Chrome. I've found extensions that reverse everything, but I've not seen a way to reverse images.

So to be clear, I've already inverted everything, so by inverting the images they will be reverted back.

It would be great to be able to invert Videos too, but I figure I can tackle that later. Less of a big deal.

Thanks!

Best Answer

  • This may be a hack but since you tagged this as Chrome we are able to use -webkit-filter to invert images with CSS.

    Maybe make an extension out of that or use a bookmarklet (like below) on each page.

    javascript:var%20imgs=document.getElementsByTagName("img");for(i=0;i<imgs.length;i++){imgs[i].setAttribute("style","-webkit-filter:invert(100%)");};
    

    Edit 1: I found Reluminate, a chrome extention that does what you want. It's a less hacky solution.

    Edit 2: Vendor prefixes (i.e webkit-) are not needed since CSS filters are pretty standard now.