Normal view

There are new articles available, click to refresh the page.
Before yesterdayMain stream

System fonts: the delights of San Francisco

By: hoakley
2 August 2024 at 14:30

Before Apple switched its system font to San Francisco in 2015, with El Capitan, it had used a succession of fonts already in widespread use, including Lucida Grande and Helvetica Neue. Those could be used in regular documents, embedded and used on other systems, and there was a good chance that anyone you sent documents to would also have those fonts installed locally, but not so for San Francisco, which is exclusive to Apple.

Open Font Book on a Mac with a standard suite of system fonts, and you won’t find San Francisco, or either of its abbreviated names of SF or SF Pro. Browse the list of fonts available in Pages or any other app and you won’t find them there either. The only place you can see them in cameo is in the 17 TrueType fonts of the SF family in /System/Library/Fonts, from SFArabic to SFNSRounded.

sysfonts1

Yet most apps use the system font in their interfaces, and sometimes they appear in their documents too. I’ll trace an example through my log browser Ulbow out to a PDF and web page of a log extract.

Because Ulbow browses log extracts, there must be no ambiguity in the glyphs displayed, no room for confusion between O and 0, or l and 1 (O and 0, or l and 1). It also helps if its characters are evenly spaced, so it uses the system monospaced font for the text contents of its window. Prior to Catalina, that was set using NSFont.monospacedDigitSystemFont(), but since then it’s done using NSFont.monospacedSystemFont() instead.

Ulbow then saves the styled text from a log extract, which is stored as an NSAttributedString, to Rich Text format. That’s much easier than it sounds, as that’s the standard format for such attributed strings, and conveniently supported by macOS. The Rich Text file sets the font to be used to .AppleSystemUIFontMonospaced-Regular, and that in turn is recognised correctly by my Rich Text editor DelightEd as the Regular face of the font .AppleSystemUIFontMonospaced. Provided that file is opened on a Mac, with the system fonts installed, macOS will find the font and display it correctly, even though you won’t ordinarily find any of these system fonts in app font menus.

Not all Rich Text editors will respect the system font set, though. While Nisus Writer Pro is happy to, Pages converts it to Helvetica whether it opens the RTF file direct, or the styled text is pasted in from DelightEd. Oddly, though, Pages adds the original font to its font menu so you can select the text and set it back to that font if you insist.

sysfonts2

Export that Rich Text file from DelightEd to PDF, and the font is carried through into the PDF source, where each block of text is set in the same font:
/Type /Font /Subtype /TrueType /BaseFont /AAAAAB+.SFNSMono-Regular /FontDescriptor
here named SFNSMono-Regular, the first mention of the system font filename. Note, though, that font isn’t embedded in the PDF, so when displayed on another system lacking macOS system fonts, it should be substituted using another monospace font such as Courier New.

sysfonts3

DelightEd will also export the Rich Text file to HTML using the standard built-in conversion, where embedded CSS sets the font as .AppleSystemUIFontMonospaced to maintain consistency. Unfortunately, that’s where the monospaced font comes to an end, as Safari won’t render it using that, despite running on macOS, and falls back to its default body font.

sysfonts4

These behaviours are all intended to ensure that San Francisco isn’t exported from your Mac to a non-Apple system. If you’re a registered Apple developer, you can download system fonts from Apple, and use them to design app mockups. But if you were to try transferring those to a different platform, then you would breach the font’s licence. In any case, other systems are likely to refuse to display those fonts because of the licence terms embedded in them.

There’s also a GitHub repository where you can download OpenType versions of all the San Francisco family for strictly non-commercial purposes. Each is accompanied by a summary of restrictions on its use.

Finally, the jewel in San Francisco’s crown isn’t a font at all, but a collection of thousands of vector-graphic symbols, SF Symbols. These are readily accessible in UIKit (iOS), AppKit (macOS), and above all in SwiftUI. A small selection of them appears in this screenshot from Unhidden.

unhidden2

❌
❌