I recently read two articles about the "system font stack" [1] [2]. Briefly, this is a list of font families designed to pick the system font on the reader's device. So the same page appears to use Apple defaults on an Mac, Windows defaults on a PC, and so on.

But generic font families serif and sans-serif already exist. Why is this not good enough? (Plus this would avoid needing to update the "stack".)

A few of my guesses:

  • "Serif" may contradict a sans-serif system font, and vice versa.
  • Browser vendor defaults may be independent of OS vendor defaults (unless system-ui becomes a new generic font family?)
  • ...but nothing like this is explicitly stated in these and similar articles I could find.

2 Answers 2


Since these articles were published, system-ui has in fact become a generic font family. The definition states:

The purpose of system-ui is to allow web content to integrate with the look and feel of the native OS.

And notes:

A cross-platform UA should use different fonts on its different supported platforms.


If your question is why would anyone use a font other than the system default, there are many reasons, among them:

  • To have more control as to how text is presented cross-platform.
  • System font does not match the brand
  • To have a more distinctive and unique look
  • System font does not have the character support needed
  • System font does not have the features/ weights needed
  • My question was more why WOULD you use the OS font, rather than the browser's serif or sans-serif. It appears some people want their website to feel OS-native on all devices (which I now appreciate).
    – lofidevops
    Commented Feb 7 at 21:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.