5

Some people who suffer protanomaly can hardly distinguish red text from black text on computer screens. Many web pages like AskUbuntu.com show visited and unvisited text links in red'ish colors. That reduces usability drastically for those affected.

How do I change the color of un/visited text links of Firefox and Chrome on Windows and Linux to classic blue'ish colors, thus making the web usable for people who suffer protanomaly?

The settings of Firefox and Chrome offer to override fonts and colors, e.g Firefox -> Edit -> Preferences -> Content -> Colors... -> untick Allow pages to choose their own colors. But that changes all fonts and all colors of every element. That's not desired; just the color of text links, no more no less.

3

Firefox

You can do this by editing (or creating if it is not there) the file userContent.css. Its location depends on the platform (the parent folder can also be found in menu Help"Troubleshooting Information" → section "Application Basics" → field "Profile Folder"):

Linux

  • $HOME/.mozilla/firefox/*default/chrome/userContent.css

Windows

Depending on the Windows version and other configuration, userContent.css is in one of the following folders:

  • C:\Documents and Settings\[username]\Application Data\Mozilla\Firefox\Profiles\[xyz].default\chrome.

  • C:\Users\[username]\AppData\Roaming\Mozilla\Firefox\Profiles\[xyz].default\chrome (more generally, it is %APPDATA%\Mozilla\Firefox\Profiles\[xyz].default\chrome).

You may have to create the chrome subdirectory and the file userContent.css.

Add these lines to that file to change the colors (obviously, you can change the actual colors used to whatever you prefer - e.g. using Paletton Live Colorizer):

a { color: #333388!important; }  /* Unvisited link color */

a:visited { color: #333340!important; }  /* Visited link color */

In most cases Firefox has to be restarted before it takes effect.

Chrome

You can do the same for Chrome by editing $HOME/.config/google-chrome/Default/User\ StyleSheets/Custom.css which on Windows, is located at %USERPROFILE%\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css.

  • @JoBo you're quite right, I thought it only applied to the links. I am trying to figure out how to do this via CSS, it should be possible. As for the link, it is an answer when it is only part of a larger answer and when the link is to a resource that does what you need. Link only answers refer to, well, link only answers. – terdon Aug 29 '13 at 15:02
  • 1
    I am looking for a comprehensive, to the point answer that let's others who suffer the same benefit as easy as possible without further searching/reading and without installing any add ons. – Johannes Aug 29 '13 at 15:06
  • @JoBo will that do? – terdon Aug 29 '13 at 15:12
  • Not quite, but it's getting there. blue and green aren't the "classic blue'ish" colors. I don't know what to use here. I am terrible at design stuff. Sth. like rgb(16, 134, 164) or so? The correct Windows path is %USERPROFILE%\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css. – Johannes Aug 29 '13 at 18:48
  • 1
    @AmyPellegrini hmm? What requirement? What isn't how you would expect CSS to work? – terdon Mar 12 at 13:16
0

The Firefox extension "Visited 1.11" appears to accomplish just what you need without changing the colors of anything else but visited links.

https://addons.mozilla.org/en-US/firefox/addon/visited/

  • 1
    Thanks! How does it change visited links? The issue is not how to distinguish visited from unvisited links, but to distinguish links from normal text. – Johannes Sep 30 '14 at 9:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.