In this article, I explore the font-family choices of popular websites to uncover trends and to help inform my own opinion about good font choices.
I came across a website and my first thought was, “that’s a nice font”. That launched me into this quick look at a handful of sites and the font choices they made.
The Apple fonts look a little different because Apple has a history of a slightly different philosophy. They sometimes use system fonts that dynamically adapt to the operating system, providing a native look on each OS, rather than using the same font across different systems. I like the approach, but even they don’t stick to it for marketing.
I took a look at the font on that first site and found that it was .AppleSystemUIFont. Maybe the fact it matched my OS made me like it or maybe something else about the layout drew me in. I’m not entirely sure.
I’ve sorted the list by simplicity.
Google surprised me with one of the most simple font-family tags I found. They include just two options.
font-family:
Helvetica Neue,
sans-serif;
I thought that Google might use a Google font, but it makes sense that they don’t. I’ve always thought that the free Google Fonts are another way for them to track users around the web. But, on their own site that’s unnecessary.
They’re also challenging some of my assumptions about their complexity.
I tend to think of Google’s software as complex and over-engineered, but here they’ve proved me wrong with the simplest tag I found.
Hacker News keeps it pretty simple with three options.
font-family:
Verdana,
Geneva,
sans-serif;
Microsoft adds a few more and seems to set the first in both quoted and unquoted variants.
“Segoe UI” is the default font on Windows systems starting with Windows Vista.
Maybe they include “SegoeUI” as a fallback for older Windows systems and other operating systems that might have the font installed but where it’s registered a bit differently.
font-family:
"Segoe UI",
SegoeUI,
"Helvetica Neue",
Helvetica,
Arial,
sans-serif;
Although they have a philosophy of using system fonts that match the OS they still use their latest font (San Francisco) on their own website. This represents their latest design choice rather than the historical system choice.
Apple seems to prioritize brand identify, just like everyone else, in their latest marketing information. That makes sense.
It’s interesting that sites that are more utility based tend to use the system choice while sites that are more marketing based tend to use their own identify choices.
font-family:
"SF Pro Text",
"SF Pro Icons",
"Helvetica Neue",
"Helvetica",
"Arial",
sans-serif;
This is the site that gave me the idea to look these up.
When I first looked at it I thought it had a nice clean font choice. It turned out to be .AppleSystemUIFont which is a result of the -apple-system selection.
font-family:
Open Sans,
-apple-system,
Segoe UI,
system-ui,
Roboto,
Helvetica Neue,
Arial
The application at ChatGPT.com seems to be pretty complex.
Their font choices aren’t too wild but it’s a comprehensive list.
font-family:
ui-sans-serif,
-apple-system,
system-ui,
Segoe UI,
Helvetica,
Apple Color Emoji,
Arial,
sans-serif,
Segoe UI Emoji,
Segoe UI Symbol
On GitHub.com it’s complicated.
On the body they use a font-family tag that includes a CSS variable plus a set of defaults. They define the variable in the :root element.
Here’s the style tag on the body, which includes the variable. Interestingly, the variable matches the default on at least some pages.
font-family:
var(--fontStack-sansSerif,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
"Noto Sans",
Helvetica,
Arial,
sans-serif,
"Apple Color Emoji",
"Segoe UI Emoji")
Written by Joel Dare on August 8, 2025.
Want to see my personal updates, tech projects, and business ideas? Join the mailing list.
JoelDare.com © Dare Companies Dotcom LLC