Menu

Helvetic Neue On The Web

CSS Tricks tips “better helvetica.” Guillermo Esteves explains that specifying font names in CSS is really about specifying font families:

If you want to use a specific font face, you have to use font-family along with the font-weight property, calling both the PostScript and screen names of that face for backwards compatibility

Which, for a person trying to use Helvetica Neue Light means the following:

font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", sans-serif;
font-weight: 300;

Steve Cochrane, meanwhile, explores the use of Helvetica Neue Light and Ultra Light. Ultra Light with an extra pixel of letter-spacing reversed against black looks pretty good in his examples.

font-family: HelveticaNeue-UltraLight, 'Helvetica Neue UltraLight', 'Helvetica Neue', Arial, Helvetica, sans-serif;
font-size: 24px;
font-weight: 100;
letter-spacing: 1px;