diff --git a/.changeset/new-grapes-hope.md b/.changeset/new-grapes-hope.md
new file mode 100644
index 0000000000..0cf7a21052
--- /dev/null
+++ b/.changeset/new-grapes-hope.md
@@ -0,0 +1,5 @@
+---
+"@rhds/elements": patch
+---
+
+`<rh-alert>`: make sure alerts always have to correct (lightest) colour palette
diff --git a/elements/rh-alert/rh-alert.ts b/elements/rh-alert/rh-alert.ts
index c704cbb9a9..07d193881e 100644
--- a/elements/rh-alert/rh-alert.ts
+++ b/elements/rh-alert/rh-alert.ts
@@ -5,6 +5,8 @@ import { customElement } from 'lit/decorators/custom-element.js';
 import { property } from 'lit/decorators/property.js';
 import { classMap } from 'lit/directives/class-map.js';
 
+import '@rhds/elements/rh-surface/rh-surface.js';
+
 import styles from './rh-alert.css';
 
 // TODO: replace with rh-icon
@@ -118,10 +120,11 @@ export class RhAlert extends LitElement {
     const hasActions = this.#slots.hasSlotted('actions');
     const hasBody = this.#slots.hasSlotted(SlotController.anonymous as unknown as string);
     return html`
-      <div id="container"
+      <rh-surface id="container"
            class="${classMap({ hasBody })}"
            role="alert"
-           aria-hidden="false">
+           aria-hidden="false"
+           color-palette="lightest">
         <div id="left-column">
           <div id="icon">${this.icon}</div>
         </div>
@@ -144,7 +147,7 @@ export class RhAlert extends LitElement {
             <slot name="actions"></slot>
           </footer>
         </div>
-      </div>
+      </rh-surface>
     `;
   }
 }