<?xml version="1.0" encoding="utf-8"?>

CSS web-safe fonts

CSS web-safe fonts Bad Practice
CSS web-safe fonts Best Practice

There's a number of typefaces that are very likely to be pre-installed on most operating systems, browsers, and devices — the so-called web-safe fonts. "Very likely" is the keyword here — because there's always a chance that a font is not found or is not installed properly.

If you want your design to look good on all devices, it's vital to provide browsers with several fallback font options so that if the first font does not work, the browser will try the next one.

Some of the best web-safe fonts are:

  • Garamond (serif)
  • Georgia (serif)
  • Times New Roman (serif)
  • Arial (sans-serif)
  • Helvetica (sans-serif)
  • Tahoma (sans-serif)
  • Trebuchet MS (sans-serif)
  • Verdana (sans-serif)
  • Courier New (monospace)
  • Brush Script MT (cursive)
Improve your UX & Product skills with interactive courses that actually work