Archived topic

System fonts and style.min.css

5 replies · Started by nomadiceman on June 30, 2021

Viewing posts 1–6 of 6

June 30, 2021 at 5:10 pm #1840401

If I use system fonts in the customiser, will the site look different on different operating systems? macOS, Chrome, Windows etc?

After I disabled Google fonts and selected the system fonts, I see that the style.min.css still lists fonts. Why is that?

June 30, 2021 at 5:18 pm #1840403

Hi there,

thats correct - each OS will have its own system font - so the style will be different.
The only font-family styles listed in the GP Stylesheets will be for the System Stack eg.

font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

Which is what defines the System Fonts for the various browser types and relevant fallbacks.

And in addition to that is the font-family for the GP Icons

June 30, 2021 at 5:34 pm #1840406

Thanks David

So is it better to select say Helvetica in the customiser, not just system font?

July 1, 2021 at 2:15 am #1840685

Helvetica is generally only present on MacOS system or older Windows Installs.
Whereas Verdana and Arial are probably the most common - available on Windows, MacOS and iOS

July 1, 2021 at 2:59 am #1840720

Perfect thanks

July 1, 2021 at 3:57 am #1840780

You're welcome

This archived topic is closed to new replies.

Start building better websites today.