diff --git a/packages/ui/src/components/Alert/Alert.module.css b/packages/ui/src/components/Alert/Alert.module.css
index cda8a45ddb..d37d656c8f 100644
--- a/packages/ui/src/components/Alert/Alert.module.css
+++ b/packages/ui/src/components/Alert/Alert.module.css
@@ -35,6 +35,11 @@
     /* Apply variables */
     background-color: var(--alert-bg);
     color: var(--alert-fg);
+
+    /* Center align when there's no description */
+    &[data-has-description='false'] {
+      align-items: center;
+    }
   }
 
   .bui-Alert[data-status='info'] {
@@ -66,12 +71,16 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    margin-top: 0.125rem;
 
     svg {
       width: 1rem;
       height: 1rem;
     }
+
+    /* Add slight top margin when there's a description for better alignment */
+    .bui-Alert[data-has-description='true'] & {
+      margin-top: 0.125rem;
+    }
   }
 
   .bui-AlertContent {
diff --git a/packages/ui/src/components/Alert/Alert.tsx b/packages/ui/src/components/Alert/Alert.tsx
index 6c53ef1697..ab3c6ff20d 100644
--- a/packages/ui/src/components/Alert/Alert.tsx
+++ b/packages/ui/src/components/Alert/Alert.tsx
@@ -127,6 +127,7 @@ export const Alert = forwardRef(
         className={classes.root}
         ref={ref}
         style={{ ...style, ...utilityStyle }}
+        data-has-description={description ? 'true' : 'false'}
         {...dataAttributes}
         {...restProps}
       >