Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Web Safe Font Weights -- How to get thinner?

Tags:

css

fonts

When I design in Photoshop, my fonts are thin and crisp, but when I declare fonts in CSS -- even when using font-weight: lighter -- the fonts always appear bolder.

Maybe this is just how the browser renders the font (In IE fonts stay thin), but I was wondering if there were any tricks or tips for achieving the same thin, crisp looks.

like image 396
HWD Avatar asked Sep 16 '10 20:09

HWD


People also ask

How do I make letters thinner in HTML?

Try declaring it right on the element with style="font-weight:400;" and you should see a difference. I took an screenshot. It seems the colour gives the word a bit of weight somehow. link when it's in black it seems a bit lighter.

What is font weight thin?

Meaning of relative weights Note that when using relative weights, only four font weights are considered — thin (100), normal (400), bold (700), and heavy (900). If a font-family has more weights available, they are ignored for the purposes of relative weight calculation.


1 Answers

Use CSS to smooth up your fonts...

put this in your CSS:

-webkit-font-smoothing: antialiased; 
like image 74
Caleb Crosby Avatar answered Sep 20 '22 00:09

Caleb Crosby