It's time to add: font-family: -apple-system,system-ui,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif This solution is harmless and very useful. It is used by GitHub, Wordpress, Bootstrap, Medium, Ghost, etc.

Apr 3, 2017 - -apple-system targets San Francisco in Safari (on Mac OS X and iOS), and it. It is deliberately listed after Segoe UI so that if you're an Android.

The main reason for using 'system' fonts is performance. Fonts are typically one of the largest/heaviest resources loaded on a website. If we can use a font already available on the user’s machine, we can completely eliminate the need to fetch this resource, making load times noticeably faster.

The beauty of system fonts is that it matches what the current OS uses, so it can be a comfortable look. • -apple-system targets San Francisco in Safari (on Mac OS X and iOS), and it targets Neue Helvetica and Lucida Grande on older versions of Mac OS X. It properly selects between San Francisco Text and San Francisco Display depending on the text’s size.

• system-ui represents the default UI font on a given platform. • BlinkMacSystemFont is the equivalent for Chrome on Mac OS X. • Segoe UI targets Windows and Windows Phone. • Roboto targets Android and newer Chrome OS. Mac software for incremental backups best 2016 action. It is deliberately listed after Segoe UI so that if you’re an Android developer on Windows and have Roboto installed, Segoe UI will be used instead. The bottom line: It's truly the ultimate solution for any website/webapp in any OS.