diff --git a/src/lib/components/MermaidChartIcon.svelte b/src/lib/components/MermaidChartIcon.svelte
index 98c54110..007128c3 100644
--- a/src/lib/components/MermaidChartIcon.svelte
+++ b/src/lib/components/MermaidChartIcon.svelte
@@ -1,7 +1,8 @@
 <script lang="ts">
+  import { asset } from '$app/paths';
   import type { ClassValue } from 'svelte/elements';
 
   let { class: className }: { class?: ClassValue } = $props();
 </script>
 
-<img class={['size-4', className]} src="/mermaidchart-logo.svg" alt="Mermaid Chart" />
+<img class={['size-4', className]} src={asset('/mermaidchart-logo.svg')} alt="Mermaid Chart" />
diff --git a/src/lib/components/Share.svelte b/src/lib/components/Share.svelte
index 2595900c..17b56844 100644
--- a/src/lib/components/Share.svelte
+++ b/src/lib/components/Share.svelte
@@ -4,6 +4,7 @@
   import { Separator } from '$/components/ui/separator';
   import { env } from '$/util/env';
   import { urlsStore } from '$/util/state';
+  import { asset } from '$app/paths';
   import ShareIcon from '~icons/material-symbols/share';
   import CopyInput from './CopyInput.svelte';
   import MermaidChartIcon from './MermaidChartIcon.svelte';
@@ -22,7 +23,7 @@
     <div class="flex flex-col gap-4">
       <div class="flex flex-col gap-2">
         <h2 class="flex items-center gap-2">
-          <img class="size-5" src="/favicon.svg" alt="Mermaid Live Editor" />
+          <img class="size-5" src={asset('/favicon.svg')} alt="Mermaid Live Editor" />
           Mermaid Live Editor
         </h2>
         <CopyInput value={window.location.href} />