Popular web design font stacks, revisited

We all have some favorite fonts, but when it comes to cross-platform design, we have to choose our fonts families carefully. So I made a huge list of font stacks that suit really good. Make sure you add this list to your favorites.

Sans-serif Fonts

Arial, Helvetica Neue, Helvetica

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

Calibri, Candara, Segoe

font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;

Candara, Calibri, Segoe

font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, Arial, sans-serif;

Franklin Gothic Medium, Arial

font-family: 'Franklin Gothic Medium', Arial, sans-serif;

Futura, Trebuchet MS, Arial

font-family: Futura, "Trebuchet MS", Arial, sans-serif;

Geneva, Tahoma, Verdana

font-family: Geneva, Tahoma, Verdana, sans-serif;

Gill Sans, Gill Sans MT, Calibri

font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif;

Lucida Grande, Lucida Sans, Geneva

font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;

Helvetica Neue, Helvetica, Arial

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

Optima, Segoe, Candara, Calibri

font-family: Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif;

Segoe UI, Segoe, Tahoma, Geneva

font-family: "Segoe UI", Segoe, Tahoma, Geneva, sans-serif;

Tahoma, Geneva, Verdana

font-family: Tahoma, Geneva, Verdana, sans-serif;

Trebuchet MS, Lucida Grande, Tahoma

font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;

Verdana, Geneva

font-family: Verdana, Geneva, sans-serif;

Serif Fonts

Baskerville, Hoefler, Garamond

font-family: Baskerville, "Baskerville old face", "Hoefler Text", Garamond, "Times New Roman", serif;

Big Caslon, Book Antiqua, Palatino Linotype

font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;

Bodoni MT, Didot, Hoefler Text

font-family: "Bodoni MT", Didot, "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif;

Book Antiqua, Palatino, Georgia

font-family: "Book Antiqua", Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;

Cambria, Georgia

font-family: Cambria, Georgia, serif;

Constantia, Palatino, Georgia

font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;

Didot, Hoefler Text, Garamond

font-family: Didot, "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif;

Garamond, Baskerville, Hoefler Text

font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;

Georgia, Cambria, Times New Roman

font-family: Georgia, Cambria, "Times New Roman", Times, serif;

Goudy Old Style, Garamond, Big Caslon

font-family: "Goudy Old Style", Garamond, "Big Caslon", "Times New Roman", serif;

Hoefler Text, Baskerville old face, Garamond

font-family: "Hoefler Text", "Baskerville old face", Garamond, "Times New Roman", serif;

Lucida Bright, Georgia

font-family: "Lucida Bright", Georgia, serif;

Palatino, Book Antiqua, Georgia

font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;

Font stacks of the Giants

If you need some inspiration about choosing your deck, here is a list of font-families used by the web giants.

Facebook – Lucida Grande/Tahoma

font-family: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;

Twitter – Helvetica Neue/Arial

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

Flickr – Arial/Helvetica

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

This one is interesting;

WordPress.org – sans-serif

font-family: sans-serif;

Conclusion

Typography is a great design element. If you use it well, it will surely pay you back. So, make sure you have the right order for your fonts. Choose your weapons carefully. You will never lose.

Related Posts

NS Weight Release

WP-Backgrounds Lite by InoPlugs Web Design and Juwelier Schönmann 1010 Wien