diff --git a/.changeset/cuddly-cows-trade.md b/.changeset/cuddly-cows-trade.md
new file mode 100644
index 00000000000..35cdaa4d810
--- /dev/null
+++ b/.changeset/cuddly-cows-trade.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+chore: use Banner instead of custom implementation for SelectPanel notice
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-dark-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-dark-tritanopia-linux.png
index a7825d1ae36..7cb1bb48032 100644
Binary files a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-dark-tritanopia-linux.png and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-on-Description-light-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-on-Description-light-colorblind-linux.png
index d31c707d771..dbef8292edd 100644
Binary files a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-on-Description-light-colorblind-linux.png and b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-on-Description-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-features--with-notice-light-linux.png b/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-features--with-notice-light-linux.png
index dfb8b8b54e0..edef41f5a10 100644
Binary files a/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-features--with-notice-light-linux.png and b/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-features--with-notice-light-linux.png differ
diff --git a/packages/react/src/Banner/Banner.docs.json b/packages/react/src/Banner/Banner.docs.json
index 43513f82982..11f6ab12bf5 100644
--- a/packages/react/src/Banner/Banner.docs.json
+++ b/packages/react/src/Banner/Banner.docs.json
@@ -100,7 +100,12 @@
     {
       "name": "variant",
       "type": "'critical' | 'info' | 'success' | 'upsell' | 'warning'",
-      "description": ""
+      "description": "Specify the type of the Banner"
+    },
+    {
+      "name": "layout",
+      "type": "'default' | 'compact'",
+      "description": "Specify the layout of the Banner. Compact layout will reduce the padding."
     }
   ],
   "subcomponents": [
diff --git a/packages/react/src/Banner/Banner.module.css b/packages/react/src/Banner/Banner.module.css
index b9a1be2a396..7a37f3786dc 100644
--- a/packages/react/src/Banner/Banner.module.css
+++ b/packages/react/src/Banner/Banner.module.css
@@ -13,6 +13,10 @@
     container: banner / inline-size;
   }
 
+  &[data-layout='compact'] {
+    padding: var(--base-size-4);
+  }
+
   &[data-variant='critical'] {
     --banner-bgColor: var(--bgColor-danger-muted);
     --banner-borderColor: var(--borderColor-danger-muted);
diff --git a/packages/react/src/Banner/Banner.tsx b/packages/react/src/Banner/Banner.tsx
index 3b79f88ad37..0ece441893d 100644
--- a/packages/react/src/Banner/Banner.tsx
+++ b/packages/react/src/Banner/Banner.tsx
@@ -64,6 +64,11 @@ export type BannerProps = React.ComponentPropsWithoutRef<'section'> & {
    * Specify the type of the Banner
    */
   variant?: BannerVariant
+
+  /**
+   * Specify the layout of the Banner. Compact layout will reduce the padding.
+   */
+  layout?: 'default' | 'compact'
 }
 
 const iconForVariant: Record<BannerVariant, React.ReactNode> = {
@@ -140,6 +145,7 @@ export const Banner = React.forwardRef<HTMLElement, BannerProps>(function Banner
       data-variant={variant}
       tabIndex={-1}
       ref={ref}
+      data-layout={rest.layout || 'default'}
     >
       <div className={classes.BannerIcon}>{icon && supportsCustomIcon ? icon : iconForVariant[variant]}</div>
       <div className={classes.BannerContainer}>
diff --git a/packages/react/src/SelectPanel/SelectPanel.module.css b/packages/react/src/SelectPanel/SelectPanel.module.css
index 4a46aae1204..3a999ad1a60 100644
--- a/packages/react/src/SelectPanel/SelectPanel.module.css
+++ b/packages/react/src/SelectPanel/SelectPanel.module.css
@@ -53,19 +53,9 @@
 }
 
 .Notice {
-  display: flex;
-  padding-top: var(--base-size-12);
-  padding-right: var(--base-size-16);
-  padding-bottom: var(--base-size-12);
-  padding-left: var(--base-size-16);
   margin-top: var(--base-size-4);
   margin-right: var(--base-size-8);
   margin-left: var(--base-size-8);
-  font-size: var(--text-body-size-small);
-  flex-direction: row;
-  border: var(--borderWidth-thin) solid;
-  gap: var(--base-size-8);
-  border-radius: var(--borderRadius-medium);
 }
 
 .Notice a {
@@ -85,7 +75,7 @@
   border-color: var(--borderColor-attention-muted);
 }
 
-.Notice:where([data-variant='error']) {
+.Notice:where([data-variant='critical']) {
   color: var(--fgColor-danger);
   background-color: var(--bgColor-danger-muted);
   border-color: var(--borderColor-danger-muted);
diff --git a/packages/react/src/SelectPanel/SelectPanel.test.tsx b/packages/react/src/SelectPanel/SelectPanel.test.tsx
index 9d2c70285cd..b42041c08c6 100644
--- a/packages/react/src/SelectPanel/SelectPanel.test.tsx
+++ b/packages/react/src/SelectPanel/SelectPanel.test.tsx
@@ -695,7 +695,7 @@ for (const usingRemoveActiveDescendant of [false, true]) {
         expect(screen.getByRole('combobox').hasAttribute('aria-describedby')).toBeTruthy()
       })
 
-      it.skip('should announce initially focused item', async () => {
+      it('should announce initially focused item', async () => {
         const user = userEvent.setup()
         renderWithFlag(<FilterableSelectPanel />, usingRemoveActiveDescendant)
 
diff --git a/packages/react/src/SelectPanel/SelectPanel.tsx b/packages/react/src/SelectPanel/SelectPanel.tsx
index 455f67c6a5b..4c7dae093d9 100644
--- a/packages/react/src/SelectPanel/SelectPanel.tsx
+++ b/packages/react/src/SelectPanel/SelectPanel.tsx
@@ -1,12 +1,4 @@
-import {
-  AlertIcon,
-  InfoIcon,
-  SearchIcon,
-  StopIcon,
-  TriangleDownIcon,
-  XIcon,
-  type IconProps,
-} from '@primer/octicons-react'
+import {SearchIcon, TriangleDownIcon, XIcon, type IconProps} from '@primer/octicons-react'
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'
 import type {AnchoredOverlayProps} from '../AnchoredOverlay'
 import {AnchoredOverlay} from '../AnchoredOverlay'
@@ -34,6 +26,7 @@ import {clsx} from 'clsx'
 import {debounce} from '@github/mini-throttle'
 import {useResponsiveValue} from '../hooks/useResponsiveValue'
 import type {ButtonProps, LinkButtonProps} from '../Button/types'
+import {Banner} from '../Banner'
 
 // we add a delay so that it does not interrupt default screen reader announcement and queues after it
 const SHORT_DELAY_MS = 500
@@ -675,12 +668,6 @@ function Panel({
     }
   }
 
-  const iconForNoticeVariant = {
-    info: <InfoIcon size={16} />,
-    warning: <AlertIcon size={16} />,
-    error: <StopIcon size={16} />,
-  }
-
   function getMessage() {
     if (items.length === 0 && !message) {
       return DefaultEmptyMessage
@@ -826,9 +813,15 @@ function Panel({
             ) : null}
           </div>
           {notice && (
-            <div ref={noticeRef} data-variant={notice.variant} className={classes.Notice}>
-              {iconForNoticeVariant[notice.variant]}
-              <div>{notice.text}</div>
+            <div ref={noticeRef}>
+              <Banner
+                variant={notice.variant === 'error' ? 'critical' : notice.variant}
+                description={notice.text}
+                title="Notice"
+                hideTitle
+                className={classes.Notice}
+                layout="compact"
+              />
             </div>
           )}
           <FilteredActionList