pixel font in HTML/CSS
Asked Answered
C

3

10

I try pixel fonts from http://www.fontsquirrel.com/fonts/list/style/Pixel but It's not perfect in the browser and disable anti-aliasing is not an official CSS property (or don't find good sample).

I found this old question : Is it possible to disable anti-aliasing in CSS when using @font-face with pixel fonts?

And this JS http://devpro.it/pixelfont/ look very nice but default font is to small (make my own font is not a good deal). So I would like to know if there is something new or others tips (without swf).

Here is a test with font-face (on webkit, firefox don't ?) : http://b4d455.fr/font/

Cowell answered 5/9, 2012 at 9:55 Comment(0)
P
9

This might do what you want to some extent:

font-smooth: never;
-webkit-font-smoothing : none;
Prehistoric answered 5/9, 2012 at 13:17 Comment(1)
I guess there's no better solution, so you still might want to upvote/accept one of the existing answers.Prehistoric
C
3

I know I'm late, but Small Font lets you use this gladly.

Here's some working CSS with no links required:

body {font-family: "MS Pゴシック";}
<!--- Here's some HTML for the example --->
<h4>Small Font</h4>
<p>Small Font is a pixel font used by Windows when a font is too small to be displayed</p>
<h5>Recommended CSS:</h5>
<code>font-size: 75%;</code>
Choke answered 30/11, 2020 at 17:30 Comment(0)
D
1

I'm not really sure what you're asking. But if you're looking to disable anti-aliasing, you might be able to use -webkit-font-smoothing: none;.

Deserted answered 5/9, 2012 at 10:23 Comment(1)
I add a test on my post, it's look better without in Chrome and nothing googd in Firefox…Arther

© 2022 - 2024 — McMap. All rights reserved.