diff --git a/assets/scss/_variables_project.scss b/assets/scss/_variables_project.scss
index 9b4a0b15..8ff5fe98 100644
--- a/assets/scss/_variables_project.scss
+++ b/assets/scss/_variables_project.scss
@@ -41,12 +41,12 @@ $table-row-default: $secondary-lighter-background;
 $td-enable-google-fonts: false;
 
 /*
- * Replace the default font with Inter - we load it from a local copy, which is downloaded from
- * Google Fonts manually via a script:
- * https://github.com/matrix-org/matrix-spec/tree/main/static/css/fonts
+ * Replace the default font with Inter.
  *
  * The $font-family-sans-serif definition here overrides the default value set by docsy:
  * https://github.com/matrix-org/docsy/blob/66a4e61d2d34edc7196b9df83a7d09cd4af14b47/assets/scss/_variables.scss#L68
- * and adds "Inter" to the front. */
-@import url("../css/fonts/Inter.css");
-$font-family-sans-serif: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
\ No newline at end of file
+ * and adds "Inter" to the front.
+ *
+ * The font itself is loaded via stylesheet link layouts/partials/hooks/head-end.html.
+ */
+$font-family-sans-serif: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
diff --git a/changelogs/internal/newsfragments/1444.clarification b/changelogs/internal/newsfragments/1444.clarification
new file mode 100644
index 00000000..1bbaa905
--- /dev/null
+++ b/changelogs/internal/newsfragments/1444.clarification
@@ -0,0 +1 @@
+Update references to Inter font.
diff --git a/layouts/partials/hooks/head-end.html b/layouts/partials/hooks/head-end.html
index 925c43cc..7bceff45 100644
--- a/layouts/partials/hooks/head-end.html
+++ b/layouts/partials/hooks/head-end.html
@@ -6,6 +6,16 @@
 
 */}}
 
+{{/*
+ Load the Inter font.
+
+ We load it from a local copy, which is downloaded from
+ Google Fonts manually via a script:
+ https://github.com/matrix-org/matrix-spec/tree/main/static/css/fonts
+*/}}
+<link rel="preload" href="{{ "/css/fonts/Inter.css" | relURL }}" as="style">
+<link rel="stylesheet" href="{{ "/css/fonts/Inter.css" | relURL }}">
+
 {{ $scss := "scss/custom.scss"}}
 {{ if .Site.IsServer }}
 {{/* Note the missing postCSS. This makes it snappier to develop in Chrome, but makes it look sub-optimal in other browsers. */}}