Chilled out text underlines

You know I’m a fan of default styles and making content look good, so this post by Chris immediately sparked my interest.

What I like most about this new color-mix() capability is that it works with currentColor, which is the current computed value of the color. It makes Chris’ technique suit a theme-based system really well as I see it, because using currentColor reduces those nasty cases where a specifically coloured link disappears in a dark theme, for example.

I’d probably go for a relative unit for text-underline-offset though. Something like:

a {
  text-underline-offset: 0.2ex;
}

That’s the value we use to make the underlines shift on :hover() on this site 😎

Advert