How To Prevent Websites Using Their Own Colors In Firefox

Firefox allows websites to choose their own colors for a page – this is usually fine as most sites are well designed and do not use garish or confusing colors.

However, there are times when it is preferable to force a site to use the default colors of Firefox instead – some webpages have such a poor design (multicolored sidebars and backgrounds etc) that it can be difficult to concentrate on reading the page.

It may also help as an Accessibility feature – color blind users or those with eyesight impairment may benefit from displaying pages in the default Firefox colors (black text on white background) – or you can easily set your own colors. [I will add this article to our ongoing list of tips for colorblind users.]

Firefox includes a little known Accessibility option to disable websites from using their own colors – by default it is set to ‘Enable’.

How To Prevent Webpages Using Their Own Colors – there are two ways to do this, either manually or automatically via a simple addon:

1. Manual option – press the Firefox Menu button (or Tools in the menu bar) and select ‘Options’. Now select the ‘Content’ tab then press the ‘Colors’ button to open the Colors window as shown below:

webcolors
Colors window

The ‘Allow pages to choose their own colors’ option is ticked by default. To force all websites to use the default selections above, untick it and press OK then press OK again to finish – the changes are applied to the current webpage immediately so you can see the effect.

If you want to change the default Firefox colors of text and background (from black on white) or link colors, you can edit them in the Colors window – click on a color to open a color picker and select the one you want.

[Tech note: the corresponding entry in about:config is browser.display. use_document_colors – the ‘Allow pages to choose their own colors’ option, set to True (enabled) by default]

2. Automatic add-on option – AcsTrigger is a simple add-on which adds an icon to the Firefox add-on Bar.

Clicking this icon toggles the ‘Allow pages to choose their own colors’ option on or off – without having to go through the Options menu system and configure it manually. The only purpose of the add-on is to automate the process of changing this setting – if you only need to change it once in a blue moon, the add-on is probably overkill.

However, it can be useful if you have tested the manual setting, find it useful and need to change it on a regular basis – the add-on does this simple task well and any change is applied to the current webpage immediately when you click the icon.

Download and install AcsTrigger from Mozilla Add-ons here. The icon appears in the right of the Add-on Bar at the bottom of Firefox – if the Add-on Bar is not displayed, right click on an empty space in the Navigation Toolbar and tick to display it.

Conclusion

It is easy to change the colors that websites can use in Firefox. If switching between color settings frequently, the add-on speeds up the process by providing a one-click icon to toggle the setting.

1 thought on “How To Prevent Websites Using Their Own Colors In Firefox”

  1. Thanks !

    I just love being able to customize software. Now i get to play with more stuff buried in Firefox ! Great tip…

Comments are closed.