Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to disable anti-aliasing in CSS when using @font-face with pixel fonts?

I want to use a pixel font on the web. I'm including it using @font-face however all the browsers are applying anti-aliasing to the font. I can't seem to find a CSS rule to disable this, can anyone think of another method of disabling anti-aliasing?

like image 400
Samuel Avatar asked Nov 18 '09 00:11

Samuel


1 Answers

I had similar problem today and it seems that although font-smooth does not work in contemporary Firefox* adding some filter does:

filter: contrast(1);

Yet it seems to be a bit hacky to disable anti-aliasing with filter. By the way it does not cause to completely disable anti-aliasing just causes it to be applied somehow differently so bitmap fonts render correctly. On the other hand it breaks rendering of non-bitmap fonts.

 * Tested on Fixedsys from http://doir.ir/fixedsys/demo.html, on Iceweasel 38.40.0, on Debian 8.

like image 158
jaboja Avatar answered Sep 19 '22 23:09

jaboja