Can CSS make fonts smooth?

Hi All,

I am here with another question:

A website project that I am working on currently requires the fonts to be smooth (Smooth as in when you choose ‘smooth’ in photoshop).

The designer has used a free font and the font does not have bold type. so smooth is really required by the client.

for now I have used a hack which I found online of using a very small shadow and blur, it looks okay but not great.

So is there any way that fonts can be displayed as they are in photoshop (smooth)?

By the way I am using cufon for the custom font.

Many Thanks.

The text-shadow is only CSS3 compatible, so it’s not visible for IE browsers. I think Cufon makes the text smooth enough, but it’s not enough for your client?

Well, I can talk to him about it.. but since I have not done much css/html work, before saying anything to him I wanted to make sure that it is really the best which could be done (using cufon and textShadow).

Thanks.

The smooth depends on browser and os. For example over winxp you have no smoothing on firefox, but you have it on ie8. On mac, any browser has smoothing. But, no, you can’t apply smooth from css.

Also, the font used is the most important thing. A font to work fine, must be created for screen. If you use a font that has been created for print, in many sizes will look realy bad and also will have problems in letterspacings.

Thanks rg,

my client is using mac so hopefully there will be no complaint

I will let the designer know about the ‘screen’ fonts.

Maybe this helps you:

-webkit-font-smoothing: none;
-webkit-font-smoothing: subpixel-antialiased;
-webkit-font-smoothing: antialiased;

Maybe this helps you:

-webkit-font-smoothing: none;
-webkit-font-smoothing: subpixel-antialiased;
-webkit-font-smoothing: antialiased;

only for the webkit ( opera ) engine, moz ( firefox ) is left out and so is trident ( internet explorer )

Maybe this helps you:

-webkit-font-smoothing: none;
-webkit-font-smoothing: subpixel-antialiased;
-webkit-font-smoothing: antialiased;

only for the webkit ( opera ) engine, moz ( firefox ) is left out and so is trident ( internet explorer )

webkit is safari, flock 3 and chrome’s engine not operas(operas engine is presto) and firefox’s engine is gecko(same with flock 2) but it uses the moz extension

great, thank you.

Was looking for something like this. Already used the shadow & blur trick but yes the results are okay but not great.

9dLabs

Hi All,

I think cuffon will make the font smooth enough shouldn’t require any other software fo rthe purpose else search google and sewe if you get any other options than the ones you have received on the forum.

Mathew Website Design and Development