diff --git a/stream/tiling-frontend/src/App.svelte b/stream/tiling-frontend/src/App.svelte
index 599c8f5..3fc4ddb 100644
--- a/stream/tiling-frontend/src/App.svelte
+++ b/stream/tiling-frontend/src/App.svelte
@@ -73,7 +73,8 @@
     };
   });
 </script>
-
+<link rel="preconnect" href="https://rsms.me/">
+<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
 <div
   style="width: 100vw; height: 100vh; overflow: hidden; position: absolute; top: 0; left: 0"
 >
diff --git a/stream/tiling-frontend/src/app.css b/stream/tiling-frontend/src/app.css
index bd6213e..f3df990 100644
--- a/stream/tiling-frontend/src/app.css
+++ b/stream/tiling-frontend/src/app.css
@@ -1,3 +1,11 @@
 @tailwind base;
 @tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
+
+:root {
+    font-family: Inter, sans-serif;
+    font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */
+  }
+  @supports (font-variation-settings: normal) {
+    :root { font-family: InterVariable, sans-serif; }
+  }
\ No newline at end of file