diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index 07b0174..dfdb800 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { resolve } from "$app/paths";
 	import { page } from "$app/state";
 	import Footer from "$lib/components/layout/Footer.svelte";
 	import TopBar from "$lib/components/layout/TopBar.svelte";
@@ -44,7 +45,7 @@
 </script>
 
 <svelte:head>
-	<link rel="icon" href="/favicon.svg" />
+	<link rel="icon" href={`${resolve("/")}favicon.svg`} />
 </svelte:head>
 
 <main class="preview-root" data-theme={theme}>
diff --git a/web/src/routes/v1/+layout.svelte b/web/src/routes/v1/+layout.svelte
index eda0668..23c138b 100644
--- a/web/src/routes/v1/+layout.svelte
+++ b/web/src/routes/v1/+layout.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
 	import { resolve } from "$app/paths";
+	import { getTheme, initTheme, setTheme } from "$lib/theme.svelte";
 	import { LOCALES, type Locale } from "$lib/v1/i18n/dict";
 	import { getLocale, initLocale, setLocale } from "$lib/v1/i18n/locale.svelte";
 	import { t } from "$lib/v1/i18n/t";
-	import { getTheme, initTheme, setTheme } from "$lib/theme.svelte";
 	import { onMount } from "svelte";
 	import "../../app_v1.css";
 
@@ -18,7 +18,7 @@
 </script>
 
 <svelte:head>
-	<link rel="icon" href="/favicon.svg" />
+	<link rel="icon" href={`${resolve("/")}favicon.svg`} />
 </svelte:head>
 
 <div class="app">