diff --git a/src/components/Layout/Page.tsx b/src/components/Layout/Page.tsx
index 59cf4386d8f..5f1558543c6 100644
--- a/src/components/Layout/Page.tsx
+++ b/src/components/Layout/Page.tsx
@@ -154,6 +154,11 @@ export function Page({
         </Head>
       )}
       {/* <SocialBanner /> */}
+      <a
+        href="#main-content"
+        className="sr-only focus:not-sr-only focus:fixed focus:top-2.5 focus:start-2.5 focus:z-50 focus:px-4 focus:py-2 focus:bg-card focus:dark:bg-card-dark focus:text-link focus:dark:text-link-dark focus:rounded-lg focus:shadow-md focus:outline-none focus:ring-2 focus:ring-link">
+        Skip to main content
+      </a>
       <TopNav
         section={section}
         routeTree={routeTree}
@@ -177,7 +182,7 @@ export function Page({
         )}
         {/* No fallback UI so need to be careful not to suspend directly inside. */}
         <Suspense fallback={null}>
-          <main className="min-w-0 isolate">
+          <main id="main-content" className="min-w-0 isolate">
             <article
               className="font-normal break-words text-primary dark:text-primary-dark"
               key={asPath}>