diff --git a/public/themes/lara-dark-amber/theme.css b/public/themes/lara-dark-amber/theme.css
index 61e8d89e8f..c864c06126 100644
--- a/public/themes/lara-dark-amber/theme.css
+++ b/public/themes/lara-dark-amber/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-dark-blue/theme.css b/public/themes/lara-dark-blue/theme.css
index 5160bac962..57b8061f84 100644
--- a/public/themes/lara-dark-blue/theme.css
+++ b/public/themes/lara-dark-blue/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-dark-cyan/theme.css b/public/themes/lara-dark-cyan/theme.css
index 1d669fb1e8..4931497146 100644
--- a/public/themes/lara-dark-cyan/theme.css
+++ b/public/themes/lara-dark-cyan/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-dark-green/theme.css b/public/themes/lara-dark-green/theme.css
index 9d0fee54e4..2fb1cd6104 100644
--- a/public/themes/lara-dark-green/theme.css
+++ b/public/themes/lara-dark-green/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-dark-indigo/theme.css b/public/themes/lara-dark-indigo/theme.css
index 80cb2be09d..996db6110a 100644
--- a/public/themes/lara-dark-indigo/theme.css
+++ b/public/themes/lara-dark-indigo/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-dark-pink/theme.css b/public/themes/lara-dark-pink/theme.css
index b33bc7d50f..66f6beab13 100644
--- a/public/themes/lara-dark-pink/theme.css
+++ b/public/themes/lara-dark-pink/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-dark-teal/theme.css b/public/themes/lara-dark-teal/theme.css
index 86565672e3..1877f30adb 100644
--- a/public/themes/lara-dark-teal/theme.css
+++ b/public/themes/lara-dark-teal/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #1f2937;
   --surface-b: #111827;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-amber/theme.css b/public/themes/lara-light-amber/theme.css
index c7eea9e311..757fd75d3a 100644
--- a/public/themes/lara-light-amber/theme.css
+++ b/public/themes/lara-light-amber/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-blue/theme.css b/public/themes/lara-light-blue/theme.css
index bfa04c472e..601dd12f9e 100644
--- a/public/themes/lara-light-blue/theme.css
+++ b/public/themes/lara-light-blue/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-cyan/theme.css b/public/themes/lara-light-cyan/theme.css
index 347d85a736..41aa00cd82 100644
--- a/public/themes/lara-light-cyan/theme.css
+++ b/public/themes/lara-light-cyan/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-green/theme.css b/public/themes/lara-light-green/theme.css
index 03171223b7..42e090faaa 100644
--- a/public/themes/lara-light-green/theme.css
+++ b/public/themes/lara-light-green/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-indigo/theme.css b/public/themes/lara-light-indigo/theme.css
index 8b75e0db73..08d946cd65 100644
--- a/public/themes/lara-light-indigo/theme.css
+++ b/public/themes/lara-light-indigo/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-pink/theme.css b/public/themes/lara-light-pink/theme.css
index c78623d6a5..1100e8d964 100644
--- a/public/themes/lara-light-pink/theme.css
+++ b/public/themes/lara-light-pink/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;
diff --git a/public/themes/lara-light-teal/theme.css b/public/themes/lara-light-teal/theme.css
index d9318310d3..eb50c88cea 100644
--- a/public/themes/lara-light-teal/theme.css
+++ b/public/themes/lara-light-teal/theme.css
@@ -1,8 +1,8 @@
 :root {
-  font-family: "InterVariable", sans-serif;
+  font-family: "Inter var", sans-serif;
   font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   font-variation-settings: normal;
-  --font-family: "InterVariable", sans-serif;
+  --font-family: "Inter var", sans-serif;
   --font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --surface-a: #ffffff;
   --surface-b: #f9fafb;
@@ -52,20 +52,20 @@
 }
 
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: normal;
   font-named-instance: "Regular";
-  src: url("./fonts/InterVariable.woff2") format("woff2");
+  src: url("./fonts/Inter-roman.var.woff2") format("woff2");
 }
 @font-face {
-  font-family: "InterVariable";
+  font-family: "Inter var";
   font-weight: 100 900;
   font-display: swap;
   font-style: italic;
   font-named-instance: "Italic";
-  src: url("./fonts/InterVariable-Italic.woff2") format("woff2");
+  src: url("./fonts/Inter-italic.var.woff2") format("woff2");
 }
 :root {
   --blue-50:#f5f9ff;