diff --git a/packages/docs/content/docs/netlify-large-media.mdx b/packages/docs/content/docs/netlify-large-media.mdx
index 57a1cb18..b633472d 100644
--- a/packages/docs/content/docs/netlify-large-media.mdx
+++ b/packages/docs/content/docs/netlify-large-media.mdx
@@ -2,9 +2,14 @@
 group: Media
 title: Netlify Large Media
 weight: 20
+deprecated: true
 ---
 
-## <img src="https://img.shields.io/badge/-Beta%20Feature-blue" alt="Beta Feature. Use at your own risk" title="Beta Feature. Use at your own risk" />
+<Alert severity="warning">
+  Netlify Large Media is deprecated as of September 1, 2023. Please refer to the deprecation notice
+  in [Netlify's Support Forums](https://docs.netlify.com/large-media/overview/) (see deprecation
+  notice).
+</Alert>
 
 [Netlify Large Media](https://www.netlify.com/features/large-media/) is a [Git LFS](https://git-lfs.github.com/) implementation for repositories connected to Netlify sites. This means that you can use Git to work with large asset files like images, audio, and video, without bloating your repository. It does this by replacing the asset files in your repository with text pointer files, then uploading the assets to the Netlify Large Media storage service.
 
diff --git a/packages/docs/src/components/docs/DeprecatedImage.tsx b/packages/docs/src/components/docs/DeprecatedImage.tsx
new file mode 100644
index 00000000..b1d40274
--- /dev/null
+++ b/packages/docs/src/components/docs/DeprecatedImage.tsx
@@ -0,0 +1,35 @@
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+
+const DeprecatedImage = () => {
+  return (
+    <Box
+      title="Beta Feature. Use at your own risk"
+      sx={{
+        width: 81,
+        height: 20,
+        background: '#ffa726',
+        borderRadius: 1,
+        display: 'inline-flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+      }}
+    >
+      <Typography
+        variant="caption"
+        sx={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          fontWeight: 'bold',
+          lineHeight: '20px',
+          color: 'white',
+        }}
+      >
+        Deprecated
+      </Typography>
+    </Box>
+  );
+};
+
+export default DeprecatedImage;
diff --git a/packages/docs/src/components/docs/DocsLeftNavGroup.tsx b/packages/docs/src/components/docs/DocsLeftNavGroup.tsx
index 00cb83e0..3194829c 100644
--- a/packages/docs/src/components/docs/DocsLeftNavGroup.tsx
+++ b/packages/docs/src/components/docs/DocsLeftNavGroup.tsx
@@ -9,6 +9,7 @@ import { useRouter } from 'next/router';
 import { useState } from 'react';
 
 import BetaImage from './BetaImage';
+import DeprecatedImage from './DeprecatedImage';
 
 import type { DocsGroupLink } from '../../interface';
 
@@ -66,7 +67,7 @@ const DocsLeftNavGroup = ({ name, links }: DocsLeftNavGroupProps) => {
                   primary={
                     <StyledListItemPrimary>
                       {link.title}
-                      {link.beta ? <BetaImage /> : null}
+                      {link.deprecated ? <DeprecatedImage /> : link.beta ? <BetaImage /> : null}
                     </StyledListItemPrimary>
                   }
                 />
diff --git a/packages/docs/src/components/layout/Header.tsx b/packages/docs/src/components/layout/Header.tsx
index 2368246a..bff59c8d 100644
--- a/packages/docs/src/components/layout/Header.tsx
+++ b/packages/docs/src/components/layout/Header.tsx
@@ -134,6 +134,7 @@ const Header = ({ mode, docsGroups, searchablePages, toggleColorMode }: HeaderPr
             title: link.title,
             url: `/docs/${link.slug}`,
             beta: link.beta,
+            deprecated: link.deprecated,
           })),
         })),
       },
diff --git a/packages/docs/src/components/layout/mobile-drawer/MobileNavLink.tsx b/packages/docs/src/components/layout/mobile-drawer/MobileNavLink.tsx
index 0c4cfb57..ac217e09 100644
--- a/packages/docs/src/components/layout/mobile-drawer/MobileNavLink.tsx
+++ b/packages/docs/src/components/layout/mobile-drawer/MobileNavLink.tsx
@@ -5,6 +5,7 @@ import { useRouter } from 'next/router';
 import { useMemo } from 'react';
 
 import BetaImage from '../../docs/BetaImage';
+import DeprecatedImage from '../../docs/DeprecatedImage';
 
 import type { MouseEvent } from 'react';
 import type { MenuLink } from '../../../interface';
@@ -15,7 +16,7 @@ interface MobileNavLinkProps {
 }
 
 const MobileNavLink = ({ link, onClick }: MobileNavLinkProps) => {
-  const { title, url, beta = false } = link;
+  const { title, url, beta = false, deprecated = false } = link;
   const { asPath } = useRouter();
 
   const selected = useMemo(() => {
@@ -35,7 +36,7 @@ const MobileNavLink = ({ link, onClick }: MobileNavLinkProps) => {
         primary={
           <>
             {title}
-            {beta ? <BetaImage /> : null}
+            {deprecated ? <DeprecatedImage /> : beta ? <BetaImage /> : null}
           </>
         }
         primaryTypographyProps={{
diff --git a/packages/docs/src/interface.ts b/packages/docs/src/interface.ts
index d2b14785..cc69251b 100644
--- a/packages/docs/src/interface.ts
+++ b/packages/docs/src/interface.ts
@@ -76,6 +76,7 @@ export interface DocsData {
   readonly weight: number;
   readonly slug: string;
   readonly beta?: boolean;
+  readonly deprecated?: boolean;
 }
 
 export interface DocsPageHeading {
@@ -95,6 +96,7 @@ export interface DocsGroupLink {
   readonly title: string;
   readonly slug: string;
   readonly beta: boolean;
+  readonly deprecated: boolean;
 }
 
 export interface DocsGroup {
@@ -133,6 +135,7 @@ export interface MenuLink {
   readonly title: string;
   readonly url: string;
   readonly beta?: boolean;
+  readonly deprecated?: boolean;
 }
 
 export interface MenuLinkSubGroup {
diff --git a/packages/docs/src/lib/docs.ts b/packages/docs/src/lib/docs.ts
index 9c11cacf..85828a65 100644
--- a/packages/docs/src/lib/docs.ts
+++ b/packages/docs/src/lib/docs.ts
@@ -137,6 +137,7 @@ export function fetchDocsContent(): [DocsPage[], DocsGroup[]] {
       title: doc.data.title,
       slug: doc.data.slug,
       beta: doc.data.beta ?? false,
+      deprecated: doc.data.deprecated ?? false,
     });
     return acc;
   }, {} as Record<string, DocsGroupLink[]>);
diff --git a/packages/docs/src/pages/docs/[doc].tsx b/packages/docs/src/pages/docs/[doc].tsx
index 75f4e72f..707a0042 100644
--- a/packages/docs/src/pages/docs/[doc].tsx
+++ b/packages/docs/src/pages/docs/[doc].tsx
@@ -4,6 +4,7 @@ import { serialize } from 'next-mdx-remote/serialize';
 import remarkGfm from 'remark-gfm';
 
 import BetaImage from '../../components/docs/BetaImage';
+import DeprecatedImage from '../../components/docs/DeprecatedImage';
 import DocsContent from '../../components/docs/DocsContent';
 import DocsLeftNav from '../../components/docs/DocsLeftNav';
 import DocsRightNav from '../../components/docs/DocsRightNav';
@@ -81,6 +82,7 @@ interface DocsProps {
   title: string;
   slug: string;
   beta: boolean;
+  deprecated: boolean;
   description: string;
   source: MDXRemoteSerializeResult;
 }
@@ -93,6 +95,7 @@ const Docs = ({
   description,
   source,
   beta,
+  deprecated,
 }: DocsProps) => {
   const theme = useTheme();
 
@@ -111,7 +114,7 @@ const Docs = ({
           <DocsContent>
             <Header1>
               {title}
-              {beta ? <BetaImage /> : null}
+              {deprecated ? <DeprecatedImage /> : beta ? <BetaImage /> : null}
             </Header1>
             <MDXRemote
               {...source}
@@ -134,6 +137,7 @@ const Docs = ({
                 Template,
                 Templates,
                 BetaImage,
+                DeprecatedImage,
                 Deprecated,
               }}
             />
@@ -186,6 +190,7 @@ export const getStaticProps: GetStaticProps = async ({ params }): Promise<{ prop
       title: data.title,
       slug: data.slug,
       beta: data.beta ?? false,
+      deprecated: data.deprecated ?? false,
       description: '',
       source,
     },