diff --git a/libs/components/src/dialog/dialog/dialog.component.html b/libs/components/src/dialog/dialog/dialog.component.html
index 83cfa21ed21..c077dc2ceb8 100644
--- a/libs/components/src/dialog/dialog/dialog.component.html
+++ b/libs/components/src/dialog/dialog/dialog.component.html
@@ -75,13 +75,19 @@
   @let isScrollable = isScrollable$ | async;
   @let showFooterBorder =
     (!bodyHasScrolledFrom().top && isScrollable) || bodyHasScrolledFrom().bottom;
+  <div
+    class="tw-border-0 tw-border-t tw-border-solid"
+    [ngClass]="{
+      'tw-border-transparent': !showFooterBorder,
+      'tw-border-secondary-100': showFooterBorder,
+    }"
+    data-chromatic="ignore"
+  ></div>
   <footer
-    class="tw-flex tw-flex-row tw-items-center tw-gap-2 tw-border-0 tw-border-t tw-border-solid tw-bg-background tw-py-5 tw-ps-6 tw-pe-4"
+    class="tw-flex tw-flex-row tw-items-center tw-gap-2 tw-bg-background tw-py-5 tw-ps-6 tw-pe-4"
     [ngClass]="{
       'tw-px-6 tw-py-4': isDrawer,
       'tw-p-4 has-[[biticonbutton]]:tw-pe-2': !isDrawer,
-      'tw-border-transparent': !showFooterBorder,
-      'tw-border-secondary-100': showFooterBorder,
     }"
   >
     <ng-content select="[bitDialogFooter]"></ng-content>