Skip to main content

From the Field Desk of C. M. Helmer

Notes

Apple System Fonts

By C. M. Helmer

In CSS:

font-family: -apple-system, sans-serif;

There are other names to access the system font on older macOS versions (when it was OS X). See, for example, GitHub’s CSS for a full stack of system fonts. For my use case — local Markdown preview and export — -apple-system is enough.

The San Francisco font family is complete, having italics, all weights, small-caps, and a wide Unicode range.

There’s also:

  • ".SF Compact"
  • ".SF Compact Rounded"
  • ".SF Compact Text"
  • ".SF UI Display Condensed"
  • ".SF UI Text Condensed"
  • ".SF Mono"

I couldn’t reference ".SF UI …" in CSS. “SF Mono” is bundled in the Terminal.app package. Some of the fonts are available for download at the Apple Developer site.