user908683 user908683 - 1 year ago 168
CSS Question

CSS very thin font?

How do I create very thin fonts with CSS, like at ?

Right now I'm using this, but I'm on a mac and I don't think "Helvetica Neue" is supported on windows.

font-family:Helvetica Neue, Helvetica, Arial, sans-serif;

Any ideas for thin, crisp fonts?

Answer Source

Google is using their font API and CSS's @font-face

See the following reference in their code:

<link href="//,400,600,700&amp;subset=latin" rel="stylesheet">

Below is the exact definition that "registers" said font:

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url('') format('woff');

Then they simply apply that font to element/s:

h1, h2, h3, h4, blockquote, q, .maia-nav ul {
   font-family: 'open sans',arial,sans-serif;

Note: @font-face fonts don't render crisply on downlevel browsers. If you need to support them try -

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download