CODEWITHSUNDEEP
javascriptcssgoogle-chromehyperlinkvisited
ElCharly64
ElCharly64

Reputation: 339

How can I change the visited links color in Chrome?

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.

Upvotes: 22

Views: 31636

Answers (8)

Julio Fernandez
Julio Fernandez

Reputation: 1

Nov 29, 2024. I just followed the instructions for https://stylebot.dev/ by visiting "Options" (the gear), then clicked on "styles" and added one style:

an asterisk on the top box, then

A:visited { color: red ! important }

Thanks for the tip!

enter image description here

Upvotes: 0

techie
techie

Reputation: 11

visit color Links below is the link color links

to set color for visited page in chrome. Add it to chrome extension is added then open website you wanted to add then click on extension top right corner it shows color links click on it select color as you wish. your wish color not there then click on # then add color code and save Hope it helps..

Upvotes: 1

Wappenull
Wappenull

Reputation: 1379

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

enter image description here

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

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

enter image description here enter image description here

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

enter image description here

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

Upvotes: 2

Vic Jang
Vic Jang

Reputation: 559

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

  1. Install the Stylist extension.
    EDIT: Stylish extension (that extension was no longer available, this alternative should work.)

  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

Upvotes: 14

ibrahim orhan
ibrahim orhan

Reputation: 21

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"

Upvotes: 2

xam
xam

Reputation: 452

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

Upvotes: 0

user5719207
user5719207

Reputation: 1

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.

Upvotes: -1

haslamjd
haslamjd

Reputation: 9

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.

Upvotes: 0

Related Questions