Clear links

Readers need to know that text is a link before they read it, and color alone isn't enough: someone who can't tell colors apart sees no difference between blue and black. That's why links keep their underline, and removing it with text-decoration: none is one of the most common design mistakes.

But the default underline hugs the letters and crowds their descenders, the tails that hang below the line in letters like g, p and y. Use text-underline-offset to move it away from them, and text-decoration-thickness to set its weight so it doesn't overpower the text.

Then come the states: :hover confirms to the reader that the text can be clicked, and :visited reminds them which pages they've already seen. The browser only accepts color properties in :visited, so a page can't use it to read your browsing history.