diff --git a/src/components/Banner/Banner.js b/src/components/Banner/Banner.js
new file mode 100644
index 00000000000..7a5827ba38b
--- /dev/null
+++ b/src/components/Banner/Banner.js
@@ -0,0 +1,26 @@
+import React from 'react';
+import { Button } from 'carbon-components-react';
+import { ArrowRight16 } from '@carbon/icons-react';
+
+import { banner, bannerText, buttonBanner } from './Banner.module.scss';
+
+const Banner = () => {
+  return (
+    <div aria-label="banner" className={banner}>
+      <p className={bannerText}>
+        <strong>
+          Carbon v10 is in maintenance mode. Support will end on Sept. 30, 2024.
+        </strong>
+      </p>
+      <Button
+        href="https://github.com/carbon-design-system/carbon/blob/main/docs/release-schedule.md"
+        className={buttonBanner}
+        kind="ghost"
+        renderIcon={ArrowRight16}>
+        Release schedule
+      </Button>
+    </div>
+  );
+};
+
+export default Banner;
diff --git a/src/components/Banner/Banner.module.scss b/src/components/Banner/Banner.module.scss
new file mode 100644
index 00000000000..fb9d8f1b2f6
--- /dev/null
+++ b/src/components/Banner/Banner.module.scss
@@ -0,0 +1,50 @@
+// banner styles
+.banner {
+  position: fixed;
+  top: 0;
+  z-index: 99999;
+  display: flex;
+  width: 100%;
+  height: 48px;
+  justify-content: space-between;
+
+  background: $blue-70;
+  color: $text-on-color;
+}
+
+.banner-text {
+  display: none;
+
+  @include carbon--breakpoint('md') {
+    @include carbon--type-style('body-short-01');
+
+    display: block;
+    padding: 15px 0 0 $spacing-05;
+  }
+}
+
+.banner-details {
+  display: none;
+
+  @include carbon--breakpoint('lg') {
+    display: inline;
+    padding-left: $spacing-03;
+  }
+}
+
+// override carbon button styles
+.buttonBanner,
+a[class*='buttonBanner'] {
+  width: 100%;
+  max-width: 100%;
+  color: $text-04;
+
+  @include carbon--breakpoint('md') {
+    width: auto;
+  }
+
+  &:hover {
+    background: $blue-70-hover;
+    color: $text-04;
+  }
+}
diff --git a/src/components/Banner/index.js b/src/components/Banner/index.js
new file mode 100644
index 00000000000..b0c13faa0a9
--- /dev/null
+++ b/src/components/Banner/index.js
@@ -0,0 +1,3 @@
+import Banner from './Banner';
+
+export default Banner;
diff --git a/src/gatsby-theme-carbon/components/Layout.js b/src/gatsby-theme-carbon/components/Layout.js
index bc2836d668a..7804d80765f 100644
--- a/src/gatsby-theme-carbon/components/Layout.js
+++ b/src/gatsby-theme-carbon/components/Layout.js
@@ -7,6 +7,7 @@ import Header from 'gatsby-theme-carbon/src/components/Header';
 import Switcher from 'gatsby-theme-carbon/src/components/Switcher';
 import Footer from 'gatsby-theme-carbon/src/components/Footer';
 import Container from 'gatsby-theme-carbon/src/components/Container';
+import Banner from '../../components/Banner';
 
 import 'gatsby-theme-carbon/src/styles/index.scss';
 import { layout } from '../../styles/Layout.module.scss';
@@ -43,6 +44,7 @@ const Layout = ({
         pageDescription={pageDescription}
         pageKeywords={pageKeywords}
       />
+      {homepage && <Banner />}
       <Header />
       <Switcher />
       <LeftNav homepage={homepage} is404Page={is404} theme={theme} />
diff --git a/src/gatsby-theme-carbon/templates/Homepage.js b/src/gatsby-theme-carbon/templates/Homepage.js
index 71d1cc22aca..a71197eb57c 100644
--- a/src/gatsby-theme-carbon/templates/Homepage.js
+++ b/src/gatsby-theme-carbon/templates/Homepage.js
@@ -47,7 +47,7 @@ const customProps = {
                 className={callToAction}
                 subTitle="Now available"
                 title="Carbon v11"
-                href="/whats-happening/v11-release/"
+                href="https://carbondesignsystem.com/migrating/guide/overview/"
                 color="dark"
                 actionIcon="arrowRight"
               />