Change Font Color of Link
To change the font color of a link using CSS, set the CSS color
property with the required Color Value for the link element.
The CSS code to set font color for link (anchor text) is showing in the following.
</>
Copy
/* inbuilt color */
a {
color: green;
}
/* hex color */
a {
color: #F70;
}
/* rgb color */
a {
color: rgb(55, 250, 90);
}
Examples
1. Green color for link
In the following example, we take two links, one with the default color value, and the other link #link2
with green font color.
index.html
</>
Copy
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
a {
color: green;
}
</style>
</head>
<body>
<h3>Colored Link</h3>
<a id="link2" href="https://www.tutorialkart.com">TutorialKart</a>
</body>
</html>
2. Link with HEX color
In the following example, we take two links, one with the default color value, and the other link #link2
with a HEX font color of #F70
.
index.html
</>
Copy
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
a#link2 {
color: #F70;
}
</style>
</head>
<body>
<h3>HEX Colored Link</h3>
<a id="link2" href="https://www.tutorialkart.com">TutorialKart</a>
</body>
</html>
Conclusion
In this CSS Tutorial, we learned how to use CSS color
property to change the font color of links, with examples.