如何在 Chrome 中更改已访问链接的颜色？

Question

I use Google Chrome Browser and I find the unvisited and visited links colors are too close each other. They are very hard to distinguish, at least to me.

I tried the old approach of modifying the Custom.css configuration file in Chrome's user data folder and no change occurred.

I'm open to solutions which include javascript code or css settings which I can run/modify in the developer's window (F12), even though they are not permanent settings.

Answer 1

Here's a solution that works for all platforms and for all versions of Chrome.

1. Install the Stylist extension
2. Click SETTINGS in Chrome
3. Click EXTENSIONS
4. Find the Stylist extension and click OPTIONS
5. Click STYLES
6. Click ADD NEW STYLE
7. Where it says "Style Name", name the style
8. Click the ALL SITE check box
9. Where it says "Stylesheet Text", copy and paste the following:
   A:visited { color: red ! important }
10. Click SAVE
11. Find a page with visited link, refresh, and you'll see the new color.

You can find colors you like here , and you can also use a color code like rgb(255, 0, 0) in place of red .

Source

Answer 2

As of version 33 of chrome browser, the stylesheets are not available anymore. So your solution on your Windows 7 pathway to custom.css is invalid.

Meanwhile, I have not been able to find a solution for this oversight by Google for those of us with visual issues.

Answer 3

Below worked for me, very good solution:

"If you want to DIY extension:

Create or Navigate to folder 'c:\\Users[local user]\\AppData\\Local\\Google\\Chrome\\UserData\\Default\\User StyleSheets\\'

Create or edit 'Custom.css' within 'User StyleSheets':

A:visited, A:visited *{color:orchid !important}

note: this code can also be used in @Vic Jang's answer.

Create or edit 'manifest.json':

{ "name": "my_custom_css", "version": "1", "content_scripts": [{ "matches": [" :// /*"], "css": ["Custom.css"] }], "manifest_version": 2 }

goto URL with chrome: 'chrome://extensions'

check the 'Developer mode' box

click on 'Load unpacked extension...'

Navigate to the 'User StyleSheets' folder which contains the 'Custom.css' & 'manifest.json'

check the 'Enabled' box next to the 'my_custom_css' extension you created

restart chrome"

Answer 4

Try StyleBot instead.

For 2022, Stylish extension from Vic Jang's answer is becoming harder to configure, it requires you to sign up to deploy your own simple CSS style. BAD!

1. Install StyleBot extension

2. Access extension option menu

3. Go to style page, add new one and fill it like this:

URL matching: * CSS: A:visited { color: red ! important } A:visited { color: red ! important }

4. Done, refresh your page once and you should get nice red visited link

5. If red is bad for readability on some site, add more override style rule for that URL/Site to another color.

Answer 5

Found solution windows 7 and 10 Tested... https://chrome.google.com/webstore/detail/stylist/pabfempgigicdjjlccdgnbmeggkbjdhd/related?hl=en

If you dont want to click the link here's how to do it

Randolph Knackstedt said: Someone just informed me about the Chrome extension, Stylist, which I highly recommend! https://chrome.google.com/webstore/detail/stylist/pabfempgigicdjjlccdgnbmeggkbjdhd/related?hl=en

This extension allows the user to select a custom visited link color and acts just as the custom.css did before the most recent Chrome update. Yay!

After the extension is installed, do the following:

--- click SETTINGS --- click EXTENSIONS --- find the stylist extension and click OPTIONS --- click STYLES --- click ADD NEW STYLE --- copy & paste the following: A:visited { color: red ! important } --- name the style --- click the ALL SITE check box --- click SAVE

Now you have red visited links. You can pick a different color if you like.

Answer 6

This solution has worked for me for a good while now. It's another chrome extension, so if Stylish doesn't work for you, try Change Colors

Answer 7

If you want to DIY extension:

1. Create or Navigate to folder 'c:\\Users[local user]\\AppData\\Local\\Google\\Chrome\\UserData\\Default\\User StyleSheets\\'

2. Create or edit 'Custom.css' within 'User StyleSheets':

   A:visited, A:visited *{color:orchid !important}

   note: this code can also be used in @Vic Jang's answer.

3. Create or edit 'manifest.json':

   { "name": "my_custom_css", "version": "1", "content_scripts": [{ "matches": ["*://*/*"], "css": ["Custom.css"] }], "manifest_version": 2 }

4. goto URL with chrome: 'chrome://extensions'

5. check the 'Developer mode' box

6. click on 'Load unpacked extension...'

7. Navigate to the 'User StyleSheets' folder which contains the 'Custom.css' & 'manifest.json'

8. check the 'Enabled' box next to the 'my_custom_css' extension you created

9. restart chrome