3 ms·
FYI for "System Font Stack" - There is no "-windows-system" CSS declaration, so this is why the list of fonts is long... it includes each windows font. More is
by degenerate 9y ago
FYI for "System Font Stack" - There is no "-windows-system" CSS declaration, so this is why the list of fonts is long... it includes each windows font. More is explained here, as well as an alternative way to load the fonts using @font-face:
https://css-tricks.com/snippets/css/system-font-stack/ https://css-tricks.com/snippets/css/system-font-stack/
- woodrowbarlow 9y agoi had never heard of this "trick" before today. why does this exist? i thought `font-family: sans` was meant to give you your OS or browser's default sans-serif font. why do something so elaborate?
- stevejohnson 9y agoThe default sans-serif font in Firefox for Mac is Helvetica, but the default font for macOS is San Francisco. If you want to have your page use a system-looking font, particularly if you're building an Electron app like Slack, you might want to get past the browser defaults and instead use the system defaults. I used macOS fonts in my example, but this applies to every platform.