diff --git a/src/app/(docs)/not-found.tsx b/src/app/(docs)/not-found.tsx
index e0ff2f0..e690aec 100644
--- a/src/app/(docs)/not-found.tsx
+++ b/src/app/(docs)/not-found.tsx
@@ -10,7 +10,8 @@ export default function NotFound() {
             404
           </h1>
           <p className="text-gray-500">
-            Looks like you&apos;ve ventured into the unknown digital realm.
+            Oops! You&apos;ve wandered off the Zen path. Let&apos;s guide you
+            back to tranquility.
           </p>
         </div>
         <Link
diff --git a/src/lib/source.ts b/src/lib/source.ts
index d9cf0b7..618f1e5 100644
--- a/src/lib/source.ts
+++ b/src/lib/source.ts
@@ -1,9 +1,19 @@
 import { docs } from "@/.source";
 import { loader } from "fumadocs-core/source";
+import { icons } from "lucide-react";
+import { createElement } from "react";
 
 // `loader()` also assign a URL to your pages
 // See https://fumadocs.vercel.app/docs/headless/source-api for more info
 export const source = loader({
+  icon(icon) {
+    if (!icon) {
+      // You may set a default icon
+      return;
+    }
+
+    if (icon in icons) return createElement(icons[icon as keyof typeof icons]);
+  },
   baseUrl: "/",
   source: docs.toFumadocsSource(),
 });