I came across this repo, which advertised that Computer Modern could be added to a website by simply including a bit of CSS. This is great, except:

  1. It's missing the fixed width font Computer Typewriter
  2. It's broken because of a Github Pages issue in that repo

So I reinvented the wheel. I got the OTF fonts from CTAN, which are usable as they are but I compressed them to WOFF2 with this, so they’re only half the size. Now I can include them with the CSS:

<link rel="stylesheet" href="https://philihp.com/assets/fonts/fonts.css" />
<style>
  body {
    font-family: "Computer Modern", serif;
    font-display: fallback;
  }
  pre,
  code {
    font-family: "Computer Typewriter", monospace;
    font-display: fallback;
  }
</style>

You can use this as long as you don’t care for anyone using Internet Explorer, and I’m okay with that.

The value you use for font-display is probably personal taste. How do you feel about late swaps of the font? I think fallback is a good compromise. IE also fails at this.