In this tutorial, we will learn how to change hyperlink underline color in HTML and CSS. HTML links are hyperlinks, as you are likely aware, and by clicking one, you can access another one. The
href attribute on the anchor element represents a hyperlink.
By default, the hyperlink underline color is blue, but you can change it if you want to. It is very easy to change the hyperlink underline color with the use of the CSS
text-decoration property and
In the following example, we will demonstrate how you can change the hyperlink underline color using CSS. Please have a look over the code example and the steps given below.
- In the HTML file, we have one anchor element with
- In the head element, we have added a stylesheet (
style.css) using the link element.
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hyperlink underline color change</title>
<link rel="stylesheet" href="./style.css">
- We are selecting the anchor element and setting the CSS
font-size property to 30px to increase the size of the text.
text-decoration property value has been set to none, and the
color property value has been set to red. As a result, it will change the default hyperlink underline color to red.