HTML: How To Change Link Color
As part of my “simplest subject possible” series of articles I’ve chosen to write about changing HTML hyperlink colors. I’ve been covering more advanced subjects for over a decade and to be honest even that can get boring sometimes.
So how do you change link color using inline HTML?
My Coding Books
In addition to this article I’ve already recorded html: how to change link color tutorial on YouTube. Who knows, maybe it’ll improve SEO, maybe not. It’s not why I’m writing it. Just don’t know how many more event-loop, prototype inheritance, css grid and css flex tutorials I can write.
So here it is, my YouTube tutorial about changing hyperlink color.
To change the color of an
HREF link (using the anchor tag
<a>) you can use inline
style attribute and apply any color you want to the
<a href = "https://google.com" style = "color: red">Google</a>
This should change the color of your link to red. You can use hexadecimal color codes (look them up online) to create any color you can imagine and that can be created using RGB values.
Changing Color’s Alpha Transparency
While writing this article I actually learned something new. You can use the 4th hexadecimal value to assign alpha transparency to your color:
How to remove the line under the link
Often when changing color of link you might also want to remove the underline from the link. In order to remove underline use following CSS code:
Reasons for changing HTML link color:
- Default link colors provided by browser don’t match your brand’s theme.
- Changing link color on mouse hover can be a UI usability issue.
- Hiding your link by blending it with text color.
My Coding Books
Thanks for reading :-)