Dark green text colors on black backgrounds? A bright white background color that hurts the eyes at night? Link colors that do not highlight links at all? Visual issues can reduce the usability of a website significantly. The Firefox add-on Color That Site lets you take care of websites that use color schemes that you dislike or can't work with at all.
Once you have installed the extension in the web browser you will notice a new icon in the browser's status bar. A click opens a sidebar on the left that displays the site's current color modifications. A go button is displayed in this spot for new sites that enables you to modify all colors used on the site.
The extension scans the website you are on and divides the colors used on it in foreground and background colors.
Holding down the left mouse button while hovering over a color highlights the locations on the page where the colors are being used. The foreground and background color menus enable you to change all colors used at once. For that, you can either use the invert colors or invert brightness checkboxes, or use mixers to change the color scheme.
A click on the preview button afterwards changes the web pages' color scheme to the selected colors. Inverting colors makes usually only sense when you invert both background and foreground colors, as you will otherwise end up with a black on black or white on white color scheme that is barely readable.
While that functionality may do the trick for you, it is not providing you with options to customize individual colors. This is supported by the extension as well, and can be done in the following way.
First thing that you may want to do is check where a color is located on the page to make sure you are modifying the correct color. To do that hold down the left mouse button over colors in the sidebar. This highlights the locations where that color is being used on the page.
To change only that color, drag and drop it to the white area of the sidebar. Here you get the same menus as before, but changes are only applied to that color and no other color on the page.
Remember to click on the preview button to test the new color on the page. Once you are satisfied with the selection, click on save to save the new color scheme for the website. You will use it with your custom color scheme whenever you open it or navigate on it.
You can modify the scope of definition under settings. Options include enabling it on a single page, a folder, the website (which is a subdomain like www.exmaple.com), or the domain. Additional preferences are available for handling background images. You can for instance switch to gradients instead or select to scale down background images.
Color That Site is an excellent add-on for the Firefox web browser to improve sites with color schemes that you do not like.Advertisement
Advertising revenue is falling fast across the Internet, and independently-run sites like Ghacks are hit hardest by it. The advertising model in its current form is coming to an end, and we have to find other ways to continue operating this site.
We are committed to keeping our content free and independent, which means no paywalls, no sponsored posts, no annoying ad formats or subscription fees.
If you like our content, and would like to help, please consider making a contribution:
Ghacks is a technology news blog that was founded in 2005 by Martin Brinkmann. It has since then become one of the most popular tech news sites on the Internet with five authors and regular contributions from freelance writers.