Monday, April 2, 2018

System Fonts in CSS

Craig Hockenberry:

Apple agreed and made a proposal on the CSS mailing list. Over the next few months that proposal evolved from being called “system” to “system-ui”. (Once upon a time, Windows used a font called “System” that could have caused a conflict.)

At the end of the day the CSS Font Module was updated and there was an official way to render text just like the operating system.


Both Chrome and Safari support it fully on a wide variety of platforms. Only Mozilla and Windows are lagging behind.

Previously: CSS Font Family for San Francisco.

Update (2021-09-08): ayanami (via Matthew Bischoff):

Starting from Safari 13.1, they added font family names for system fonts:

  • ui-monospace — SF Mono
  • ui-serif — New York
  • ui-sans-serif — San Francisco (same as system-ui and -apple-system)

Comments RSS · Twitter

Leave a Comment