diff --git a/apps/v4/app/(app)/docs/[[...slug]]/page.tsx b/apps/v4/app/(app)/docs/[[...slug]]/page.tsx
index a921a40821..f16f7c980f 100644
--- a/apps/v4/app/(app)/docs/[[...slug]]/page.tsx
+++ b/apps/v4/app/(app)/docs/[[...slug]]/page.tsx
@@ -1,13 +1,18 @@
 import Link from "next/link"
 import { notFound } from "next/navigation"
 import { mdxComponents } from "@/mdx-components"
-import { IconArrowLeft, IconArrowRight } from "@tabler/icons-react"
+import {
+  IconArrowLeft,
+  IconArrowRight,
+  IconArrowUpRight,
+} from "@tabler/icons-react"
 import { findNeighbour } from "fumadocs-core/server"
 
 import { source } from "@/lib/source"
-import { absoluteUrl } from "@/lib/utils"
+import { absoluteUrl, cn } from "@/lib/utils"
 import { DocsTableOfContents } from "@/components/docs-toc"
 import { OpenInV0Cta } from "@/components/open-in-v0-cta"
+import { Badge } from "@/registry/new-york-v4/ui/badge"
 import { Button } from "@/registry/new-york-v4/ui/button"
 
 export const revalidate = false
@@ -80,6 +85,9 @@ export default async function Page(props: {
   const MDX = doc.body
   const neighbours = await findNeighbour(source.pageTree, page.url)
 
+  // @ts-expect-error - revisit fumadocs types.
+  const links = doc.links
+
   return (
     <div
       data-slot="docs"
@@ -129,6 +137,24 @@ export default async function Page(props: {
                 </p>
               )}
             </div>
+            {links ? (
+              <div className="flex items-center space-x-2 pt-4">
+                {links?.doc && (
+                  <Badge asChild variant="secondary">
+                    <Link href={links.doc} target="_blank" rel="noreferrer">
+                      Docs <IconArrowUpRight />
+                    </Link>
+                  </Badge>
+                )}
+                {links?.api && (
+                  <Badge asChild variant="secondary">
+                    <Link href={links.api} target="_blank" rel="noreferrer">
+                      API Reference <IconArrowUpRight />
+                    </Link>
+                  </Badge>
+                )}
+              </div>
+            ) : null}
           </div>
           <div className="w-full flex-1 *:data-[slot=alert]:first:mt-0">
             <MDX components={mdxComponents} />
diff --git a/apps/v4/source.config.ts b/apps/v4/source.config.ts
index f256eebe55..122355ddf9 100644
--- a/apps/v4/source.config.ts
+++ b/apps/v4/source.config.ts
@@ -1,5 +1,10 @@
-import { defineConfig, defineDocs } from "fumadocs-mdx/config"
+import {
+  defineConfig,
+  defineDocs,
+  frontmatterSchema,
+} from "fumadocs-mdx/config"
 import rehypePrettyCode from "rehype-pretty-code"
+import { z } from "zod"
 
 import { transformers } from "@/lib/highlight-code"
 
@@ -25,6 +30,16 @@ export default defineConfig({
   },
 })
 
-export const docs: ReturnType<typeof defineDocs> = defineDocs({
+export const docs = defineDocs({
   dir: "content/docs",
+  docs: {
+    schema: frontmatterSchema.extend({
+      links: z
+        .object({
+          doc: z.string().optional(),
+          api: z.string().optional(),
+        })
+        .optional(),
+    }),
+  },
 })