diff --git a/app/about/page.tsx b/app/about/page.tsx
index e18fe42..652a99d 100644
--- a/app/about/page.tsx
+++ b/app/about/page.tsx
@@ -21,7 +21,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 function SocialLink({
                         className,
diff --git a/app/page.tsx b/app/page.tsx
index b4fb5a2..8d3e52f 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -22,7 +22,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 function Article(article: Article) {
     return (
diff --git a/app/projects/page.tsx b/app/projects/page.tsx
index 70110a9..2ab6eef 100644
--- a/app/projects/page.tsx
+++ b/app/projects/page.tsx
@@ -17,7 +17,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 export const revalidate = 0
 
diff --git a/app/reading/page.tsx b/app/reading/page.tsx
index c0a4477..7ca0a83 100644
--- a/app/reading/page.tsx
+++ b/app/reading/page.tsx
@@ -13,7 +13,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 type Book = {
     title: string
diff --git a/app/services/page.tsx b/app/services/page.tsx
index db64f6a..f270ea9 100644
--- a/app/services/page.tsx
+++ b/app/services/page.tsx
@@ -22,7 +22,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 type Services = {
     title: string
diff --git a/app/uses/page.tsx b/app/uses/page.tsx
index 4cd7868..711edb9 100644
--- a/app/uses/page.tsx
+++ b/app/uses/page.tsx
@@ -14,7 +14,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 function ToolsSection({children, title}: { children: ReactNode, title: string }) {
     return (
diff --git a/app/writing/migrating-from-vercel-to-raspberry-pi-5/page.mdx b/app/writing/migrating-from-vercel-to-raspberry-pi-5/page.mdx
index d16fb10..c754327 100644
--- a/app/writing/migrating-from-vercel-to-raspberry-pi-5/page.mdx
+++ b/app/writing/migrating-from-vercel-to-raspberry-pi-5/page.mdx
@@ -12,7 +12,16 @@ export const meta = {
     description: 'Recently, I decided to migrate this website from Vercel to a self-hosted environment using a Raspberry Pi 5. This transition was driven by several motivations, such as lowering costs and having greater control over the software and hardware that I run.',
     alternates: {
         canonical: `/writing/${createSlug('Migrating from Vercel to Raspberry Pi 5')}`
-    }
+    },
+    images: [
+        {
+            url: `/images/vishnu-mohanan-rZKdS0wI8Ks-unsplash.jpg`,
+            width: 1200,
+            height: 600,
+            alt: 'Migrating from Vercel to Raspberry Pi 5',
+            type: 'image/jpg'
+        }
+    ]
 }
 
 export const metadata = _metadata({
@@ -20,7 +29,8 @@ export const metadata = _metadata({
     heading: meta.title,
     description: meta.description,
     type: 'article',
-    alternates: meta.alternates
+    alternates: meta.alternates,
+    images: meta.images
 })
 
 export default (props) => <ArticleLayout
diff --git a/app/writing/page.tsx b/app/writing/page.tsx
index b8249cc..32e475d 100644
--- a/app/writing/page.tsx
+++ b/app/writing/page.tsx
@@ -17,7 +17,21 @@ const meta = {
     }
 }
 
-export const metadata = _metadata({...meta, heading: meta.heading})
+export let metadata: {
+    [p: string]: string | Object
+    heading: string
+    description: string
+    title: string
+    type: string
+    openGraph: {
+        images: string | Object
+        description: string
+        title: string
+        type: string
+    }
+}
+
+metadata = _metadata({...meta, heading: meta.heading})
 
 function Article({article}: { article: Article }) {
     return (
diff --git a/app/writing/secure-your-websites-with-lets-encrypt-npm-and-cloudflare/page.mdx b/app/writing/secure-your-websites-with-lets-encrypt-npm-and-cloudflare/page.mdx
index 7478301..e830c97 100644
--- a/app/writing/secure-your-websites-with-lets-encrypt-npm-and-cloudflare/page.mdx
+++ b/app/writing/secure-your-websites-with-lets-encrypt-npm-and-cloudflare/page.mdx
@@ -14,7 +14,16 @@ export const meta = {
     description: 'SSL/TLS is the encryption standard or protocol which encrypts the session between a website (server) and the browser (client). This protects us from potential man-in-the-middle attacks whereby an attacker could eavesdrop on the session and see all the traffic and data exchanged in the clear.',
     alternates: {
         canonical: `/writing/${createSlug('Secure your websites with Let\'s Encrypt, NPM and Cloudflare')}`
-    }
+    },
+    images: [
+        {
+            url: `/images/mariia-shalabaieva-zVC8A0CrTZ0-unsplash.jpg`,
+            width: 1200,
+            height: 600,
+            alt: 'Secure your websites with Let\'s Encrypt, NPM and Cloudflare',
+            type: 'image/jpg'
+        }
+    ]
 }
 
 export const metadata = _metadata({
@@ -22,7 +31,8 @@ export const metadata = _metadata({
     heading: meta.title,
     description: meta.description,
     type: 'article',
-    alternates: meta.alternates
+    alternates: meta.alternates,
+    images: meta.images
 })
 
 export default (props) => <ArticleLayout
diff --git a/app/writing/using-tailscale-to-bypass-steam-families-restrictions/page.mdx b/app/writing/using-tailscale-to-bypass-steam-families-restrictions/page.mdx
index 7e3c765..8e18b6a 100644
--- a/app/writing/using-tailscale-to-bypass-steam-families-restrictions/page.mdx
+++ b/app/writing/using-tailscale-to-bypass-steam-families-restrictions/page.mdx
@@ -11,7 +11,16 @@ export const meta = {
     description: 'This past week, Steam launched Steam Families, which allows Steam account owners to share their game library with up to six members of their family.',
     alternates: {
         canonical: `/writing/${createSlug('Using Tailscale to bypass Steam Families restrictions')}`
-    }
+    },
+    images: [
+        {
+            url: `/images/024a06f7b503c5ae8f9442ac521e06b9c9bc21e8.png`,
+            width: 1200,
+            height: 600,
+            alt: 'Using Tailscale to bypass Steam Families restrictions',
+            type: 'image/png'
+        }
+    ]
 }
 
 export const metadata = _metadata({
@@ -19,7 +28,8 @@ export const metadata = _metadata({
     heading: meta.title,
     description: meta.description,
     type: 'article',
-    alternates: meta.alternates
+    alternates: meta.alternates,
+    images: meta.images
 })
 
 export default (props) => <ArticleLayout
diff --git a/lib/generateMetadata.ts b/lib/generateMetadata.ts
index eca793f..777a13b 100644
--- a/lib/generateMetadata.ts
+++ b/lib/generateMetadata.ts
@@ -12,15 +12,17 @@ export const metadata = (meta: Meta) => {
         openGraph: {
             title: meta.title,
             description: meta.description,
-            images: [
-                {
-                    url: `/api/og-image?text=${meta.heading}`,
-                    width: 1200,
-                    height: 600,
-                    alt: meta.heading,
-                    type: 'image/png'
-                }
-            ],
+            images: meta.images
+                ? meta.images
+                : [
+                    {
+                        url: `/api/og-image?text=${meta.heading}`,
+                        width: 1200,
+                        height: 600,
+                        alt: meta.heading,
+                        type: 'image/png'
+                    }
+                ],
             type: meta.type
         }
     }
diff --git a/public/images/024a06f7b503c5ae8f9442ac521e06b9c9bc21e8.png b/public/images/024a06f7b503c5ae8f9442ac521e06b9c9bc21e8.png
new file mode 100644
index 0000000..36c4c25
Binary files /dev/null and b/public/images/024a06f7b503c5ae8f9442ac521e06b9c9bc21e8.png differ
diff --git a/public/images/getty-images-ZGvS7H9nYbk-unsplash.jpg b/public/images/getty-images-ZGvS7H9nYbk-unsplash.jpg
new file mode 100644
index 0000000..e79d31c
Binary files /dev/null and b/public/images/getty-images-ZGvS7H9nYbk-unsplash.jpg differ
diff --git a/public/images/mariia-shalabaieva-zVC8A0CrTZ0-unsplash.jpg b/public/images/mariia-shalabaieva-zVC8A0CrTZ0-unsplash.jpg
new file mode 100644
index 0000000..d2bd8e3
Binary files /dev/null and b/public/images/mariia-shalabaieva-zVC8A0CrTZ0-unsplash.jpg differ
diff --git a/public/images/vishnu-mohanan-rZKdS0wI8Ks-unsplash.jpg b/public/images/vishnu-mohanan-rZKdS0wI8Ks-unsplash.jpg
new file mode 100644
index 0000000..564de5d
Binary files /dev/null and b/public/images/vishnu-mohanan-rZKdS0wI8Ks-unsplash.jpg differ