Science, Tech, Math › Computer Science Web Safe Font Stacks Share Flipboard Email Print Busà Photography / Getty Images Science, Tech, Math PHP Programming Perl Python Java Programming Javascript Programming Delphi Programming C & C++ Programming Ruby Programming Visual Basic View More By Jennifer Kyrnin Jennifer Kyrnin Writer University of California University of Washington Jennifer Kyrnin is a professional web developer who assists others in learning web design, HTML, CSS, and XML. Learn about our Editorial Process Updated on March 10, 2020 Finding a good font stack that conveys both the style of your website but is also reliable across the majority of websites out there can be tricky. If you use non-web safe fonts then your website might not look as you intend it to when the browser substitutes something surprising for your fancy font. These font stacks are separated by family (serif, monospace, etc.). When you use a font that is not a web safe font, you should put it first in your font stack, and then add one of these stacks to the end. Choose the font stack that is closest in style and look to your preferred font. Sans Serif Web Safe Font Stacks Sans serif text is good for reading on web pages because there are no serifs to get blurry on the screen. font-family: Arial, Helvetica, sans-serif;font-family: 'Arial Black', Gadget, sans-serif;font-family: Impact, Charcoal, sans-serif;font-family: 'MS Sans Serif', Geneva, sans-serif;font-family: Tahoma, Geneva, sans-serif;font-family: 'Trebuchet MS', Helvetica, sans-serif;font-family: Verdana, Geneva, sans-serif; Serif Web Safe Font Stacks Serif fonts work great for headlines. The larger type of headlines means the serifs won't get blurry on monitors. font-family: 'Book Antiqua', 'Palatino Linotype', Palatino, serif;font-family: Bookman, serif;font-family: Georgia, serif;font-family: 'MS Serif', 'New York', serif;font-family: 'Times New Roman', Times, serif; Monospace Font Stacks Monospace fonts are usually used to render code and other type styles that look best in a font where all the characters are the same width — like typewriter fonts. font-family: Courier, monospace;font-family: 'Courier New', Courier, monospace;font-family: 'Lucida Console', Monaco, monospace; Cursive Font Stacks Cursive fonts can be difficult to read, and the most commonly found one on most systems (Comic Sans) is disliked by as many people as like it. font-family: 'Comic Sans MS', cursive; Fantasy Font Stacks Like cursive fonts, fantasy fonts can be hard to read, and they are even less common across most systems. In fact, you may notice that I'm using the same font stack as one I used above in the sans serif category, that's because impact and charcoal are so distinctive that some people consider them fantasy fonts. font-family: Impact, Charcoal, fantasy; Dingbats, Wingdings, or Symbol Font Stacks Dingbats or wingdings are symbol fonts that display little icons or pictures instead of letters. There is no generic font type for these, and so some computers may display very different fonts than you expect. Plus, only Internet Explorer will display the symbols. Firefox and other browsers simply display the text in the default font for the browser. font-family: Symbol;font-family: Webdings;font-family: Wingdings, 'Zapf Dingbats'; Cite this Article Format mla apa chicago Your Citation Kyrnin, Jennifer. "Web Safe Font Stacks." ThoughtCo, Jul. 31, 2021, thoughtco.com/web-safe-font-stacks-3467429. Kyrnin, Jennifer. (2021, July 31). Web Safe Font Stacks. Retrieved from https://www.thoughtco.com/web-safe-font-stacks-3467429 Kyrnin, Jennifer. "Web Safe Font Stacks." ThoughtCo. https://www.thoughtco.com/web-safe-font-stacks-3467429 (accessed May 29, 2023). copy citation