diff --git a/src/examples/notification/NotificationExamples.tsx b/src/examples/notification/NotificationExamples.tsx
new file mode 100644
index 000000000..bc9ff59df
--- /dev/null
+++ b/src/examples/notification/NotificationExamples.tsx
@@ -0,0 +1,14 @@
+import { SandboxHeader } from "@components/sandbox/sandbox-header/sandboxHeader.tsx";
+import { NotificationServiceOutageExample } from "@examples/notification/NotificationServiceOutageExample.tsx";
+
+export const NotificationExamples = () => {
+  return (
+    <>
+      <SandboxHeader
+        exampleTitle="Communicate a future service outage"
+        figmaExample="https://www.figma.com/design/aIRjvBzpIUH0GbkffjbL04/%E2%9D%96-Patterns-library-%7C-DDD?node-id=6311-93778&t=sWyB4A2UXCb9rn2W-1">
+      </SandboxHeader>
+      <NotificationServiceOutageExample />
+    </>
+  )
+}
diff --git a/src/examples/notification/NotificationServiceOutageExample.tsx b/src/examples/notification/NotificationServiceOutageExample.tsx
new file mode 100644
index 000000000..495947814
--- /dev/null
+++ b/src/examples/notification/NotificationServiceOutageExample.tsx
@@ -0,0 +1,66 @@
+import { Sandbox } from "@components/sandbox";
+import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx";
+import { GoabNotification  } from "@abgov/react-components";
+import { useContext } from "react";
+import { LanguageVersionContext } from "@contexts/LanguageVersionContext.tsx";
+
+export const NotificationServiceOutageExample = () => {
+  const {version} = useContext(LanguageVersionContext);
+  return (
+    <>
+      <Sandbox fullWidth allow={['h2', 'h3', 'p']} skipRender>
+        {/*Angular code*/}
+        {version === "old" && <CodeSnippet
+          lang="typescript"
+          tags="angular"
+          allowCopy={true}
+          code={`
+            <goa-notification type="important">
+              Our system will be under maintenance from Thursday, September 15, 2025 at 10 pm to Friday, September 16, 2025 at 10 am. If you have questions or concerns, contact us at <a href="mailto:support@example.com">support@example.com</a>. 
+            </goa-notification>
+          `}
+        />}
+
+        {version === "new" && <CodeSnippet
+          lang="typescript"
+          tags="angular"
+          allowCopy={true}
+          code={`
+            <goab-notification type="important">
+              Our system will be under maintenance from Thursday, September 15, 2025 at 10 pm to Friday, September 16, 2025 at 10 am. If you have questions or concerns, contact us at <a href="mailto:support@example.com">support@example.com</a>. 
+            </goab-notification>
+          `}
+        />}
+
+        {/*React code*/}
+        {version === "old" && <CodeSnippet
+          lang="typescript"
+          tags="react"
+          allowCopy={true}
+          code={`
+            <GoaNotification type="important">
+              Our system will be under maintenance from Thursday, September 15, 2025 at 10 pm to Friday, September 16, 2025 at 10 am. If you have questions or concerns, contact us at <a href="mailto:support@example.com">support@example.com</a>. 
+            </GoaNotification>
+          `}
+        />}
+
+        {version === "new" && <CodeSnippet
+          lang="typescript"
+          tags="react"
+          allowCopy={true}
+          code={`
+            <GoabNotification type="important">
+              Our system will be under maintenance from Thursday, September 15, 2025 at 10 pm to Friday, September 16, 2025 at 10 am. If you have questions or concerns, contact us at <a href="mailto:support@example.com">support@example.com</a>. 
+            </GoabNotification>
+          `}
+        />}
+
+          <GoabNotification type="important">
+          Our system will be under maintenance from Thursday, September 15, 2025 at 10 pm 
+          to Friday, September 16, 2025 at 10 am. If you have questions or concerns, 
+          contact us at <a href="mailto:support@example.com">support@example.com</a>. 
+          </GoabNotification>
+      </Sandbox>
+    </>
+  )
+}
diff --git a/src/routes/components/Notificationbanner.tsx b/src/routes/components/Notificationbanner.tsx
index 5ea2b2118..5925c0171 100644
--- a/src/routes/components/Notificationbanner.tsx
+++ b/src/routes/components/Notificationbanner.tsx
@@ -15,7 +15,7 @@ import { ComponentContent } from "@components/component-content/ComponentContent
 import { GoabNotificationType } from "@abgov/ui-components-common";
 import { DesignEmpty } from "@components/empty-states/design-empty/DesignEmpty.tsx";
 import { AccessibilityEmpty } from "@components/empty-states/accessibility-empty/AccessibilityEmpty.tsx";
-import {ExamplesEmpty} from "@components/empty-states/examples-empty/ExamplesEmpty.tsx";
+import { NotificationExamples } from "@examples/notification/NotificationExamples.tsx";
 
 // == Page props ==
 
@@ -161,11 +161,11 @@ export default function NotificationBannerPage() {
             heading={
               <>
                 Examples
-                <GoabBadge type="information" content="0" />
+                <GoabBadge type="information" content="1" />
               </>
             }
           >
-          <ExamplesEmpty />
+          <NotificationExamples />
           </GoabTab>
 
           <GoabTab heading="Design">