diff --git a/astro/src/content/pages/pages.ts b/astro/src/content/pages/pages.ts
index f8d0c05..154ca6b 100644
--- a/astro/src/content/pages/pages.ts
+++ b/astro/src/content/pages/pages.ts
@@ -3,6 +3,7 @@ import { print } from 'graphql';
 import { formatDate } from "@/lib/dates";
 import getAllPages from "@/graphql/pages/getAllPages.graphql";
 import getPage from "@/graphql/pages/getPage.graphql";
+import { getImageUrl } from "@/lib/images";
 
 export function dataToPage(pageRecord: any): WebPage {
     let dates: string[] = [
@@ -27,7 +28,7 @@ export function dataToPage(pageRecord: any): WebPage {
                     title: component["hero_title"],
                     text: component["hero_text"],
                     backgroundImage: {
-                        url: component["background_image"]["filename_disk"],
+                        url: getImageUrl(component["background_image"]["filename_disk"]),
                         width: component["background_image"]["width"],
                         height: component["background_image"]["height"]
                     }
@@ -47,7 +48,7 @@ export function dataToPage(pageRecord: any): WebPage {
                     text: component["twsi_text"],
                     imageSide: component["twsi_image_side"],
                     image: {
-                        url: component["image"]["filename_disk"],
+                        url: getImageUrl(component["image"]["filename_disk"]),
                         width: component["image"]["width"],
                         height: component["image"]["height"]
                     }
@@ -144,7 +145,7 @@ export function dataToPage(pageRecord: any): WebPage {
                         title: itemRecord["title"],
                         text: itemRecord["text"],
                         icon: {
-                            url: itemRecord["icon"]["filename_disk"],
+                            url: getImageUrl(itemRecord["icon"]["filename_disk"]),
                             width: itemRecord["icon"]["width"],
                             height: itemRecord["icon"]["height"]
                         }
@@ -177,7 +178,7 @@ export function dataToPage(pageRecord: any): WebPage {
                         stars: reviewRecord["stars"],
                         date: reviewRecord["date"],
                         thumbnail: {
-                            url: reviewRecord["thumbnail"]["filename_disk"],
+                            url: getImageUrl(reviewRecord["thumbnail"]["filename_disk"]),
                             width: reviewRecord["thumbnail"]["width"],
                             height: reviewRecord["thumbnail"]["height"]
                         }
@@ -209,7 +210,7 @@ export function dataToPage(pageRecord: any): WebPage {
                         text: contactMethodRecord["text"],
                         color: contactMethodRecord["color"],
                         icon: {
-                            url: contactMethodRecord["icon"]["filename_disk"],
+                            url: getImageUrl(contactMethodRecord["icon"]["filename_disk"]),
                             width: contactMethodRecord["icon"]["width"],
                             height: contactMethodRecord["icon"]["height"]
                         }
@@ -298,7 +299,7 @@ export function dataToPage(pageRecord: any): WebPage {
             allowCrawlers: searchEngine["allow_crawler"],
             priority: searchEngine["priority"],
             thumbnail: {
-                url: searchEngine["thumbnail"]["filename_disk"],
+                url: getImageUrl(searchEngine["thumbnail"]["filename_disk"]),
                 height: searchEngine["thumbnail"]["height"],
                 width: searchEngine["thumbnail"]["width"]
             }
diff --git a/astro/src/lib/images.ts b/astro/src/lib/images.ts
new file mode 100644
index 0000000..6cc96ac
--- /dev/null
+++ b/astro/src/lib/images.ts
@@ -0,0 +1,3 @@
+export function getImageUrl(url: string) {
+    return `${import.meta.env.DIRECTUS_URL}assets/${url}`;
+}