If you’re going to use thick light link underlines (text-decoration-color: #ccd6ce; text-decoration-thickness: .2em; text-underline-offset: .25em), please also turn off descender skipping with `text-decoration-skip-ink: none`. With this style of underline, descender skipping becomes a surprisingly large distraction if it kicks in, achieving precisely the opposite of what it was introduced to achieve (reducing distractions and improving readability).
(Tested in Firefox and Chrome on Windows on a 2× display. In Firefox, shifting the underline about half a CSS pixel further clears the ink skipping. In Chrome, it already clears it by about 2.7 CSS pixels, because the default underline position already takes font metrics into account, which seems a very-dubious-to-wrong choice to me once you’re offsetting, but is currently within spec since the `text-underline-position: auto` spec just says “The user agent may use any algorithm to determine the underline’s position; however it must be placed at or under the alphabetic baseline.” `text-underline-position: from-font` explicitly opts into this behaviour (works on Firefox), and there is no way of opting out (so I don’t think there’s any way to instruct Chrome to draw the underline touching the text baseline).
If you’re going to use thick light link underlines (text-decoration-color: #ccd6ce; text-decoration-thickness: .2em; text-underline-offset: .25em), please also turn off descender skipping with `text-decoration-skip-ink: none`. With this style of underline, descender skipping becomes a surprisingly large distraction if it kicks in, achieving precisely the opposite of what it was introduced to achieve (reducing distractions and improving readability).
(Tested in Firefox and Chrome on Windows on a 2× display. In Firefox, shifting the underline about half a CSS pixel further clears the ink skipping. In Chrome, it already clears it by about 2.7 CSS pixels, because the default underline position already takes font metrics into account, which seems a very-dubious-to-wrong choice to me once you’re offsetting, but is currently within spec since the `text-underline-position: auto` spec just says “The user agent may use any algorithm to determine the underline’s position; however it must be placed at or under the alphabetic baseline.” `text-underline-position: from-font` explicitly opts into this behaviour (works on Firefox), and there is no way of opting out (so I don’t think there’s any way to instruct Chrome to draw the underline touching the text baseline).