diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index d6f1702..69c5d85 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -71,7 +71,7 @@
 	font-weight: 400;
 	font-stretch: normal;
 	font-style: normal;
-	src: url('fonts/WOFF2/IosevkaTerm-Regular.woff2') format('woff2'), url('fonts/TTF/IosevkaTerm-Regular.ttf') format('truetype');
+	src: url('$fonts/WOFF2/IosevkaTerm-Regular.woff2') format('woff2'), url('$fonts/TTF/IosevkaTerm-Regular.ttf') format('truetype');
 }
 
 @font-face {
@@ -80,7 +80,7 @@
 	font-weight: 700;
 	font-stretch: normal;
 	font-style: normal;
-	src: url('fonts/WOFF2/IosevkaTerm-Bold.woff2') format('woff2'), url('fonts/TTF/IosevkaTerm-Bold.ttf') format('truetype');
+	src: url('$fonts/WOFF2/IosevkaTerm-Bold.woff2') format('woff2'), url('$fonts/TTF/IosevkaTerm-Bold.ttf') format('truetype');
 }
 
 a:link, a:visited, a:hover, a:active {
diff --git a/vite.config.js b/vite.config.js
index d76fc8a..27c6e3b 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,8 +1,14 @@
+import { resolve } from 'path';
 import { defineConfig } from 'vitest/config';
 import { sveltekit } from '@sveltejs/kit/vite';
 
 export default defineConfig({
 	plugins: [sveltekit()],
+	resolve: {
+		alias: {
+			$fonts: resolve('./static/fonts')
+		}
+	},
 
 	test: {
 		include: ['src/**/*.{test,spec}.{js,ts}']