CSS font stacks, developer FAQs & web standards

Your banner ad here

WestNIC provides reliable web hosting services

Site navigation below

CSS fonts should be based on a generic font family to ensure an appropriate style font is rendered in any circumstances. Preferred font names should be declared in order of preference in a comma separated font family list tailored for specific platforms.

CSS font family: serif

Serif fonts tend to have a relatively narrow, upright shape with distinctive serifs across the end of the letter strokes. Serif font faces are generally considered to have a classic, formal, businesslike font style that is reliable for the Web. Use the CSS font family name serif.

The most common serif fonts

The only serif fonts common to all systems are the ubiquitous Times New Roman and Georgia, although its frequency on Unix family operating systems is quite low. The original Times font on which Times New Roman is based is common to Mac and Unix family systems.

Palatino is found on Mac and to a lesser extent Unix systems and is the inspiration for Book Antiqua, which is quite common on Windows. Garamond is available on Windows and Mac systems, but is not very common on either.

As their names suggest, New Century Schoolbook for Mac, Century Schoolbook for Windows and Century Schoolbook L for Unix family systems have a common style. Also, Bookman for Mac, Bookman Old Style for Windows and URW Bookman L have a common heritage.

Most common serif fonts on Windows systems to 14 August 2010
Font name Installed (%) Sample Image
Times New Roman 99.61% 99.61% Text Image
Georgia 98.98% 98.98% Text Image
Palatino Linotype 98.79% 98.79% Text Image
Sylfaen 96.22% 96.22% Text Image
Garamond 86.91% 86.91% Text Image
Book Antiqua 86.38% 86.38% Text Image
Bookman Old Style 85.94% 85.94% Text Image
Cambria 65.10% 65.10% Text Image
Cambria Math 64.76% 64.76% Text
Constantia 64.47% 64.47% Text Image
Perpetua 62.38% 62.38% Text Image
MS Mincho 61.90% 61.90% Text
Rockwell 60.98% 60.98% Text Image
Calisto MT 54.44% 54.44% Text Image
Century Schoolbook 53.85% 53.85% Text Image
Goudy Old Style 53.56% 53.56% Text Image
Rockwell Condensed 52.69% 52.69% Text
Onyx 52.16% 52.16% Text
Gloucester MT Extra Condensed 52.11% 52.11% Text
Baskerville Old Face 51.87% 51.87% Text
Footlight MT Light 51.62% 51.62% Text Image
Bell MT 51.09% 51.09% Text
Centaur 50.61% 50.61% Text
Californian FB 50.56% 50.56% Text
High Tower Text 50.46% 50.46% Text
Bodoni MT 50.32% 50.32% Text
Bodoni MT Black 50.27% 50.27% Text
Bodoni MT Condensed 50.27% 50.27% Text
Niagara Engraved 50.22% 50.22% Text
Niagara Solid 50.22% 50.22% Text
Lucida Fax 48.91% 48.91% Text
Bodoni MT Poster Compressed 48.38% 48.38% Text
Batang 46.92% 46.92% Text
SimSun 46.53% 46.53% Text
Iskoola Pota 46.19% 46.19% Text
DaunPenh 45.71% 45.71% Text
Nyala 45.71% 45.71% Text
Lucida Bright 45.32% 45.32% Text
Arabic Typesetting 45.24% 45.24% Text
PMingLiU 41.11% 41.11% Text
MS PMincho 38.49% 38.49% Text
NSimSun 38.44% 38.44% Text
MingLiU 38.39% 38.39% Text
BatangChe 38.00% 38.00% Text
Bitstream Vera Serif 18.42% 18.42% Text
University Roman LET 6.98% 6.98% Text
Times 4.70% 4.70% Text
Palatino 4.36% 4.36% Text
New Century Schoolbook 4.22% 4.22% Text
MS Reference Serif 3.88% 3.88% Text
Georgia Ref 3.83% 3.83% Text
Runic MT Condensed 2.38% 2.38% Text
New York 1.45% 1.45% Text
Hoefler Text 1.02% 1.02% Text
Minion Web 0.39% 0.39% Text

Font stack builder: Start a serif font stack

Most common serif fonts on Mac systems to 14 August 2010
Font name Installed (%) Sample Image
Times 98.15% 98.15% Text Image
Georgia 95.51% 95.51% Text Image
Times New Roman 94.99% 94.99% Text Image
Baskerville 89.97% 89.97% Text Image
American Typewriter 89.71% 89.71% Text Image
Didot 89.45% 89.45% Text Image
Hoefler Text 89.45% 89.45% Text Image
Big Caslon 88.13% 88.13% Text Image
Palatino 79.68% 79.68% Text Image
Lucida Bright 77.04% 77.04% Text
Hiragino Mincho ProN 75.00% 75.00% Text
Kailasa 60.71% 60.71% Text
Kokonor 60.71% 60.71% Text
GungSeo 35.71% 35.71% Text
Adobe Fangsong Std 33.93% 33.93% Text
Adobe Ming Std 33.93% 33.93% Text
Adobe Myungjo Std 33.93% 33.93% Text
Adobe Song Std 33.93% 33.93% Text
Garamond 29.55% 29.55% Text
Century Schoolbook 29.02% 29.02% Text
Bookman Old Style 28.76% 28.76% Text
Book Antiqua 27.70% 27.70% Text
Goudy Old Style 26.12% 26.12% Text
Footlight MT Light 25.33% 25.33% Text
Calisto MT 24.80% 24.80% Text
Cambria 14.78% 14.78% Text
Constantia 13.98% 13.98% Text
Bitstream Vera Serif 12.93% 12.93% Text
New York 11.08% 11.08% Text Image
Bembo 5.56% 5.56% Text
Bernhard Modern Std 3.89% 3.89% Text
ITC Century 3.33% 3.33% Text
New Century Schoolbook 2.90% 2.90% Text
Minion Std 2.78% 2.78% Text
Bookman 2.37% 2.37% Text Image
Minion Web 1.85% 1.85% Text
Belwe 1.67% 1.67% Text
Caslon 1.06% 1.06% Text
Utopia 0.79% 0.79% Text
URW Antiqua T 0.53% 0.53% Text

Font stack builder: Start a serif font stack

Most common serif fonts on Unix systems to 14 August 2010
Font name Installed (%) Sample Image
Century Schoolbook L 97.87% 97.87% Text Image
URW Bookman L 97.26% 97.26% Text Image
URW Palladio L 95.74% 95.74% Text Image
Nimbus Roman No9 L 95.14% 95.14% Text Image
Bitstream Charter 90.81% 90.81% Text Image
DejaVu Serif 87.23% 87.23% Text Image
DejaVu Serif Condensed 82.72% 82.72% Text
FreeSerif 74.82% 74.82% Text Image
Liberation Serif 73.53% 73.53% Text
Lucida Bright 73.21% 73.21% Text Image
Bitstream Vera Serif 71.12% 71.12% Text Image
Times New Roman 67.17% 67.17% Text
Georgia 64.44% 64.44% Text
Utopia 38.60% 38.60% Text Image
MgOpen Canonica 30.51% 30.51% Text
Luxi Serif 26.75% 26.75% Text Image
Times 20.06% 20.06% Text Image
New Century Schoolbook 19.45% 19.45% Text Image
Linux Libertine 16.52% 16.52% Text
DejaVu LGC Serif 9.57% 9.57% Text
DejaVu LGC Serif Condensed 9.57% 9.57% Text
Charter 8.51% 8.51% Text
ClearlyU 8.21% 8.21% Text
LucidaBright 8.09% 8.09% Text
Garamond 7.14% 7.14% Text
Caslon 5.36% 5.36% Text
Vera Serif 4.04% 4.04% Text

Font stack builder: Start a serif font stack

Font stacks for print style sheets

Our main interest is to build reliable font stacks for screen rendering, but CSS allows us to specify a different font stack to print Web pages. The most reliable way to apply print media style sheets is to use the media attribute on the style sheet link element. The selectors you choose and font-family declarations you add to this style sheet will only apply when the page is printed.

<link rel="stylesheet" type="text/css"
      href="/styles/print.css" media="print" />
    

What font combinations would you choose for print? Use the font stack builder to create a print font stack and submit your ideas.

Other CSS font family resources

Web font survey and sampler

Contribute to the survey and discover the new Web safe fonts.

Web font foundations

Font jargon: CSS font family glossary

Find fonts: Anchor Points: Font foundries & sources

Get the sampler font code: Sampler.css

Article feedback

Your comments on this article will be appreciated, please use the form below to submit your views. If you would like a reply or article update notification, include your email address.

Information: Your email address will not be mis-used. If you include your address you may be sent a personal reply, you will not be added to any mailing list unless you request update notification. Read the site privacy statement for details.

Add this page to your chosen social bookmarking service

Style warning, please read

Home · CSS · Java · Javascript · HTML · Help · Log