diff --git a/config/utils.js b/config/utils.js
index 0f9e87d..25c7274 100644
--- a/config/utils.js
+++ b/config/utils.js
@@ -1,3 +1,4 @@
+const path = require("path").posix;
 const slugify = require("slugify");
 
 const slugifyString = (string) => {
@@ -6,6 +7,9 @@ const slugifyString = (string) => {
   });
 };
 
+const getFontUrl = (src) => path.join("/assets/fonts", src);
+
 module.exports = {
+  getFontUrl,
   slugifyString,
 };
diff --git a/src/_data/preloads.js b/src/_data/preloads.js
index a3e154f..1e21ac8 100644
--- a/src/_data/preloads.js
+++ b/src/_data/preloads.js
@@ -1,19 +1,20 @@
-const fonts = require("./fonts");
+const { getFontUrl } = require("../../config/utils");
+const fonts = require("../../config/design-tokens/fonts.json");
 
 const preloads = [
   {
     as: "font",
-    href: fonts.display.weights.extraBold.url,
+    href: getFontUrl(fonts.display.weights.ExtraBold.path),
     crossorigin: true,
   },
   {
     as: "font",
-    href: fonts.display.weights.bold.url,
+    href: getFontUrl(fonts.display.weights.Bold.path),
     crossorigin: true,
   },
   {
     as: "font",
-    href: fonts.body.weights.regular.url,
+    href: getFontUrl(fonts.body.weights.Regular.path),
     crossorigin: true,
   },
 ];
diff --git a/src/css-utils/font-family.js b/src/css-utils/font-family.js
index df1f247..40bfee8 100644
--- a/src/css-utils/font-family.js
+++ b/src/css-utils/font-family.js
@@ -1,8 +1,6 @@
-const path = require("path").posix;
+const { getFontUrl } = require("../../config/utils");
 const fonts = require("../../config/design-tokens/fonts.json");
 
-const getFontUrl = (src) => path.join("/assets/fonts", src);
-
 const fontsToCss = (fonts) => {
   return Object.entries(fonts).reduce((css, [, fontProperties]) => {
     const family = fontProperties.family;