Archived topic
Order of "system-ui" in GP system font stack?
3 replies · Started by acela on March 29, 2021
Greetings,
Looking at the current GeneratePress system font stack:
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
...I researched a bit further about "system-ui" and found the following:
https://infinnie.github.io/blog/2017/systemui.html
https://github.com/picturepan2/spectre/issues/666
It's no problem for me as my site is in English – but wondering if this caveat still applies, and if the relative placement of "system-ui" (ahead of "Segoe UI") could cause issues in some other languages?
Cheers
Hi there,
It’s no problem for me as my site is in English – but wondering if this caveat still applies, and if the relative placement of “system-ui” (ahead of “Segoe UI”) could cause issues in some other languages?
If you want to cater to everyone in a more finely tuned manner, then yes.
And if you must change the system stack order, you can use the generate_typography_system_stack filter.
Example:
add_filter( 'generate_typography_system_stack', function() {
return '-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif';
} );
OK, thanks Elvin – that's great it's easily tunable.
Not an issue for my English site – but just thought to mention it / ask, in case there's any problem for customers using other languages.
Also perhaps something to keep in mind if you consider adjusting the default in the future.
Thanks again.
It's a minor thing so we'll see if it's something to be changed when the need arises. :)
No problem. :D