After publishing the Customizing iTerm2 post I was really bothered by the way the font was looking in the code block. Some people are more comfortable with anti-aliased fonts all the time, I personally can’t write or read code like that. I like looking at Monaco in 10pt without any anti-aliasing, just plain old pixels, so this was obviously bothering me.

I did some poking around, asked Google, asked my sister but there seems to be no solution for it. Nothing that’ll work properly on every browser (why isn’t that surprising). There was something called font-smooth  in the CSS3 specification in 2002 but they later removed it from the standard. MDN has a page on it only stating that they don’t implement it. There is however a purely webkit alternative called –webkit-font-smoothing  that lets you do almost the same thing. I found a pretty extensive blog post about it which came with a demo page. I found some hacks to get fake anti-aliasing that were pretty interesting, but nothing to get rid of it.

.crayon-line {
    font-smooth: never;
	-webkit-font-smoothing: none;
}

For now I’ll be happy with the following CSS and hope that font-smooth finds its way back to the CSS specification.