diff --git a/.webpack/webpack.base.js b/.webpack/webpack.base.js
index 025c8bd13..59de36b54 100644
--- a/.webpack/webpack.base.js
+++ b/.webpack/webpack.base.js
@@ -168,6 +168,10 @@ module.exports = (env, argv, { SRC_DIR, ENTRY }) => {
             },
           ],
         },
+        {
+          test: /\.(woff|woff2|eot|ttf|otf)$/i,
+          type: 'asset/resource',
+        },
       ], //.concat(vtkRules),
     },
     resolve: {
diff --git a/platform/app/public/html-templates/index.html b/platform/app/public/html-templates/index.html
index 08acb95d1..adfbeec98 100644
--- a/platform/app/public/html-templates/index.html
+++ b/platform/app/public/html-templates/index.html
@@ -198,17 +198,6 @@
 
     <title>OHIF Viewer</title>
 
-    <!-- WEB FONTS -->
-    <link
-      rel="preconnect"
-      href="https://fonts.gstatic.com"
-      crossorigin
-    />
-    <link
-      href="https://fonts.googleapis.com/css?family=Inter:100,300,400,500,700&display=swap"
-      rel="preload"
-      as="style"
-    />
     <script>
       function browserImportFunction(moduleId) {
         return import(moduleId);
diff --git a/platform/app/public/html-templates/rollbar.html b/platform/app/public/html-templates/rollbar.html
index 98738fa6c..6234fd350 100644
--- a/platform/app/public/html-templates/rollbar.html
+++ b/platform/app/public/html-templates/rollbar.html
@@ -194,10 +194,6 @@
     <title>OHIF Viewer</title>
 
     <!-- WEB FONTS -->
-    <link
-      href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700&display=swap"
-      rel="stylesheet"
-    />
 
     <!-- EXTENSIONS -->
     <!-- <script type="text/javascript" src="path/to/some-extension.js"></script>
diff --git a/platform/ui-next/src/assets/fonts.css b/platform/ui-next/src/assets/fonts.css
new file mode 100644
index 000000000..5827d4360
--- /dev/null
+++ b/platform/ui-next/src/assets/fonts.css
@@ -0,0 +1,50 @@
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 100;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 300;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/platform/ui-next/src/assets/woff2/latin.woff2 b/platform/ui-next/src/assets/woff2/latin.woff2
new file mode 100644
index 000000000..0d91b7ab5
Binary files /dev/null and b/platform/ui-next/src/assets/woff2/latin.woff2 differ
diff --git a/platform/ui-next/src/tailwind.css b/platform/ui-next/src/tailwind.css
index 07987ee1f..90271c9cf 100644
--- a/platform/ui-next/src/tailwind.css
+++ b/platform/ui-next/src/tailwind.css
@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
+@import './assets/fonts.css';
 
 @tailwind base;
 @tailwind components;
diff --git a/platform/ui/.storybook/manager-head.html b/platform/ui/.storybook/manager-head.html
index 9bca7f170..a17c2234b 100644
--- a/platform/ui/.storybook/manager-head.html
+++ b/platform/ui/.storybook/manager-head.html
@@ -1,7 +1,3 @@
-<link
-  href="https://fonts.googleapis.com/css?family=Lato:100,300,400,500,700&display=swap"
-  rel="stylesheet"
-/>
 <title>OHIF UI Component</title>
 <style>
   body {
diff --git a/platform/ui/src/assets/styles/fonts.css b/platform/ui/src/assets/styles/fonts.css
new file mode 100644
index 000000000..5827d4360
--- /dev/null
+++ b/platform/ui/src/assets/styles/fonts.css
@@ -0,0 +1,50 @@
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 100;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 300;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin */
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url('assets/woff2/latin.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
+    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/platform/ui/src/assets/woff2/latin.woff2 b/platform/ui/src/assets/woff2/latin.woff2
new file mode 100644
index 000000000..0d91b7ab5
Binary files /dev/null and b/platform/ui/src/assets/woff2/latin.woff2 differ
diff --git a/platform/ui/src/tailwind.css b/platform/ui/src/tailwind.css
index 52d0b3630..8bda44030 100644
--- a/platform/ui/src/tailwind.css
+++ b/platform/ui/src/tailwind.css
@@ -1,5 +1,5 @@
 /* IMPORT CUSTOM FONT */
-@import url('https://fonts.googleapis.com/css?family=Inter:100,300,400,500,700&display=swap');
+@import './assets/styles/fonts.css';
 
 @tailwind base;
 @tailwind components;