If you’re like me, you love System Fonts. They can keep your webpage loading-time speedy, and they look damn good.
Craig Hockenberry (author of the snippet below), was previously a software developer for Apple, Microsoft, and Adobe. He’s been at the center of figuring out how to leverage these fonts for use on the web. As more and more front-end developers prescribe the use of System Fonts for web applications, we’ll increasingly have a web that looks familiar and friendly.
It’s kind of like how the highway system (for the most part) uses the same typeface for signage. At any rate, I use it here and will definitely use it again. Here’s a basic usage directly from Craig:
body {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
"Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
"Helvetica Neue", sans-serif;
}
Many thanks to Craig, for his prior contributions in software and his continued research on CSS System Fonts.
Read more: System Fonts in CSS
