Syntax for loading external font files

In the universal CSS file at the top (Kevin Powell includes this before the html{} rules)

@font-face {
  font-family: 'MyFontName';
  src: url('path/to/font-file.woff2') format('woff2');
}

You can repeat the src: line if you want a fallback format (ttf, woff) In the CSS rule:

p {
  font-family: 'MyFontName', Helvetica, Arial, sans-serif;
}

The long and short on font formats is that there are a bunch. Use woff2 and be done. Source: https://www.oakharborwebdesigns.com/blog/articles/how-to-optimize-a-website.html, https://youtu.be/zK-yy6C2Nck, and others