From what I can see, the goal of "system font stack" is trying to use native system font when possible, particularly on mobile. And all these articles gave rationales about how it would be superior than some of the traditional stacks such as `font-family: "Helvetica Neue", Arial, sans-serif;`, which I fully agree.

However, none of them seem to address an obvious question: why not just use "font-family: sans-serif;"? The only discussion I found that is on a "notable enough" project is this issue on normalize.css repo: https://github.com/necolas/normalize.css/issues/665

-- By assigning only "sans-serif", it will fallback to exactly that: system's default (san-serif) font. For example, there is no need to manually assign, say, "Roboto" (a typical choice for any of these "system font stacks") on Android, to accomplish so: "sans-serif" uses Roboto already. Similar can be said for iOS etc.

Wikipedia (desktop version, not mobile version) perhaps is the only "notable" site I knew that uses simply "sans-serif", and it seems to work flawlessly for years, on all devices.

Another plus for just using "sans-serif" is that for ends that have finer control over fonts (such as desktop browsers), users can assign their own preferred fonts (therefore overriding the system default ones) and it will be immediately applied to the website. This won't happen for sites that have hard-coded fonts (including these "system font stacks").

Disclaimer: I'm not a designer, but a end-user who is relatively sensitive to fonts.

[1] https://woorkup.com/system-font/ [2] https://markdotto.com/2018/02/07/github-system-fonts/ [3] https://furbo.org/2018/03/28/system-fonts-in-css/ [4] https://support.zendesk.com/hc/en-us/articles/115012937927-About-the-system-font-stack [5] https://flaviocopes.com/css-system-fonts/

(Just search "system font stack to get more)