Black text looks bolder on white background

[JayOram]

From Ben Tweedy in EmailGeeks slack:

Just spent an hour pulling my hair out and trying to work out why a custom font looks bolder than it should do…. Turns out it’s because of the anti-aliasing algorithm being used in some browsers. If anyone encounters the same, add this to your head (I always used to include it but removed it a while ago….back in it goes!)

body {
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
}

https://stackoverflow.com/questions/14477265/css-white-text-on-black-background-looks-bolder

[JayOram]

Been looking into this a lot, totally geeking out about font-smoothing. Couple of interesting points in this post: https://usabilitypost.com/2012/11/05/stop-fixing-font-smoothing/

I think it would be something for a specific use case, rather than a total reset/normalisation. Looks like -o-font-smoothing: antialiased; is actually for opera and hasn't been applicable since 2008 version, and opera now works with -webkit-font-smoothing: antialiased;.

body {
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
}

Definitely something to know about, but possibly not a total reset?