diff --git a/projects/angular/src/emphasis/alert/_alert.clarity.scss b/projects/angular/src/emphasis/alert/_alert.clarity.scss
index fe25c663f3..7586aef3da 100644
--- a/projects/angular/src/emphasis/alert/_alert.clarity.scss
+++ b/projects/angular/src/emphasis/alert/_alert.clarity.scss
@@ -1,6 +1,6 @@
 /*
  * Copyright (c) 2016-2024 Broadcom. All Rights Reserved.
- * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.   
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
@@ -306,22 +306,42 @@
 
     &.alert-info {
       @include generateAlertType(app-info);
+
+      .alert-item .btn {
+        @extend .btn-info-outline;
+      }
     }
 
     &.alert-danger {
       @include generateAlertType(app-danger);
+
+      .alert-item .btn {
+        @extend .btn-danger-outline;
+      }
     }
 
     &.alert-neutral {
       @include generateAlertType(app-neutral);
+
+      .alert-item .btn {
+        @extend .btn-neutral-outline;
+      }
     }
 
     &.alert-warning {
       @include generateAlertType(app-warning);
+
+      .alert-item .btn {
+        @extend .btn-warning-outline;
+      }
     }
 
     &.alert-success {
       @include generateAlertType(app-success);
+
+      .alert-item .btn {
+        @extend .btn-success-outline;
+      }
     }
 
     .alert-items {
diff --git a/projects/angular/src/emphasis/alert/_variables.alert.scss b/projects/angular/src/emphasis/alert/_variables.alert.scss
index f97e131dc0..e255bd8f9f 100644
--- a/projects/angular/src/emphasis/alert/_variables.alert.scss
+++ b/projects/angular/src/emphasis/alert/_variables.alert.scss
@@ -1,6 +1,6 @@
 /*
  * Copyright (c) 2016-2024 Broadcom. All Rights Reserved.
- * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.   
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
@@ -517,10 +517,10 @@ $clr-app-alert-neutral: (
   icon-color: var(--clr-app-alert-neutral-icon-color),
   color: var(--clr-app-alert-neutral-font-color),
   border-color: var(--clr-app-alert-neutral-border-color),
-  close-icon-color: var(--clr-app-alert-neutral-close-icon-color),
-  action-color: var(--clr-app-alert-neutral-action-color),
-  action-active-color: var(--clr-app-alert-neutral-action-active-color),
-  close-icon-hover-color: var(--clr-app-alert-neutral-close-icon-hover-color),
+  close-icon: var(--clr-app-alert-neutral-close-icon-color),
+  action: var(--clr-app-alert-neutral-action-color),
+  action-active: var(--clr-app-alert-neutral-action-active-color),
+  close-icon-hover: var(--clr-app-alert-neutral-close-icon-hover-color),
 ) !default;
 
 @function lookupAppNeutralAlertColor($property: color) {