diff --git a/libs/components/src/dialog/dialog/dialog.component.html b/libs/components/src/dialog/dialog/dialog.component.html
index a1e1aa6f378..bea165c9a90 100644
--- a/libs/components/src/dialog/dialog/dialog.component.html
+++ b/libs/components/src/dialog/dialog/dialog.component.html
@@ -6,7 +6,7 @@
   <div
     class="tw-flex tw-items-center tw-gap-4 tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300 tw-p-4"
   >
-    <h1 bitDialogTitleContainer class="tw-mb-0 tw-grow tw-text-lg tw-uppercase">
+    <h1 bitDialogTitleContainer class="tw-mb-0 tw-grow tw-truncate tw-text-lg tw-uppercase">
       <ng-content select="[bitDialogTitle]"></ng-content>
     </h1>
     <button
diff --git a/libs/components/src/dialog/dialog/dialog.stories.ts b/libs/components/src/dialog/dialog/dialog.stories.ts
index a97b054f358..8ba031b680a 100644
--- a/libs/components/src/dialog/dialog/dialog.stories.ts
+++ b/libs/components/src/dialog/dialog/dialog.stories.ts
@@ -82,6 +82,12 @@ Small.args = {
   title: "Small",
 };
 
+export const LongTitle = Template.bind({});
+LongTitle.args = {
+  dialogSize: "small",
+  title: "Long_Title_That_Should_Be_Truncated",
+};
+
 export const Large = Template.bind({});
 Large.args = {
   dialogSize: "large",