diff --git a/frontend/app/theme.less b/frontend/app/theme.less
index d5375751..2185491b 100644
--- a/frontend/app/theme.less
+++ b/frontend/app/theme.less
@@ -8,7 +8,7 @@
     --grey-text-color: #666;
     --main-bg-color: #000000;
     --border-color: #333333;
-    --base-font: normal 15px / normal "Lato", sans-serif;
+    --base-font: normal 15px / normal "Inter", sans-serif;
     --fixed-font: normal 12px / normal "Hack", monospace;
     --accent-color: rgb(88, 193, 66);
     --panel-bg-color: rgba(31, 33, 31, 1);
diff --git a/frontend/util/fontutil.ts b/frontend/util/fontutil.ts
index a84c6c6b..86ea0cb2 100644
--- a/frontend/util/fontutil.ts
+++ b/frontend/util/fontutil.ts
@@ -6,6 +6,7 @@ let isLatoFontLoaded = false;
 let isHackFontLoaded = false;
 let isBaseFontsLoaded = false;
 let isFiraCodeLoaded = false;
+let isInterFontLoaded = false;
 
 function addToFontFaceSet(fontFaceSet: FontFaceSet, fontFace: FontFace) {
     // any cast to work around typing issue
@@ -106,6 +107,19 @@ function loadHackFont() {
     hackBoldItalic.load();
 }
 
+function loadInterFont() {
+    if (isInterFontLoaded) {
+        return;
+    }
+    isInterFontLoaded = true;
+    const interFont = new FontFace("Inter", "url('fonts/inter-variable.woff2')", {
+        style: "normal",
+        weight: "400",
+    });
+    addToFontFaceSet(document.fonts, interFont);
+    interFont.load();
+}
+
 function loadBaseFonts() {
     if (isBaseFontsLoaded) {
         return;
@@ -121,7 +135,7 @@ function loadBaseFonts() {
 
 function loadFonts() {
     loadBaseFonts();
-    loadLatoFont();
+    loadInterFont();
     loadJetBrainsMonoFont();
     loadHackFont();
     loadFiraCodeFont();
diff --git a/public/fonts/inter-variable.woff2 b/public/fonts/inter-variable.woff2
new file mode 100644
index 00000000..22a12b04
Binary files /dev/null and b/public/fonts/inter-variable.woff2 differ