Change Font Color of Link using CSS

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 a link (<a> tag element) is shown in the following.

</>
Copy
/* inbuilt color */
a {
  color: green;
}
/* hex color */
a {
  color: #F70;
}
/* rgb color */
a {
  color: rgb(55, 250, 90);
}

Examples

Example 1. Setting Green Color for Link

In this 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#link2 {
      color: green;
    }
  </style>
</head>
<body>
  <p><a href="https://www.example.com">Default Link</a></p>
  <p><a id="link2" href="https://www.example.com">Link with Specific Color</a></p>
</body>
</html>

Output:

Example 2. Set Link Color with HEX Color Value

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>
  <p><a href="https://www.example.com">Default Link</a></p>
  <p><a id="link2" href="https://www.example.com">Link with Specific Color</a></p>
</body>
</html>

Output: