MyBB Community Forums

Full Version: Can MyBB use "system-ui" font stack?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hi, I came across some interesting code and suggestions for using any device's default "System UI" fonts for websites. For example, if you view a website from an iPhone, the system font is San Francisco, with all of the built in weights, international and emoji support - the same website viewed on Windows would call up Segoe, on Android, Roboto, etc.

The WordPress Admin uses this, as does GitHub, etc. Some might find these fonts boring, but they are actually very well designed for their respective devices, and make any website look like a native "app" on any device. The reason I mention it is that system ui fonts load very fast, and avoid the need to download a google font (for example), which is a big benefit for mobile visitors.

I was wondering if MyBB uses this, or might consider building it in to the default theme (and ACP) for future versions?

Some references:

https://make.wordpress.org/core/2016/07/...ts-in-4-6/

https://github.com/csstools/sanitize.css...graphy.css

https://furbo.org/2018/03/28/system-fonts-in-css/

The CSS Working Group has a draft proposal (since 2015) to simplify this to a simple "system-ui" snippet... (which apparently still causes some conflicts on older Windows systems in Explorer....)

https://www.w3.org/TR/css-fonts-4/#valde...-system-ui
This would be amazing for 1.9. I have been using custom font stacks for a few months instead of Google fonts and they are much nicer.

https://css-tricks.com/snippets/css/system-font-stack/

An example font stack I have been using is.
font-family: BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;

Quote:Defaulting to the system font of a particular operating system can boost performance because the browser doesn't have to download any font files, it's using one it already had. That's true of any "web safe" font, though. The beauty of "system" fonts is that it matches what the current OS uses, so it can be a comfortable look.