diff --git a/framework/src/Volo.Abp.BlazoriseUI/AbpCrudPageBase.cs b/framework/src/Volo.Abp.BlazoriseUI/AbpCrudPageBase.cs
index 13308e3a11..dfd02817b4 100644
--- a/framework/src/Volo.Abp.BlazoriseUI/AbpCrudPageBase.cs
+++ b/framework/src/Volo.Abp.BlazoriseUI/AbpCrudPageBase.cs
@@ -321,12 +321,18 @@ namespace Volo.Abp.BlazoriseUI
             return InvokeAsync(CreateModal.Hide);
         }
 
+        protected virtual void ClosingCreateModal(ModalClosingEventArgs eventArgs)
+        {
+            // cancel close if clicked outside of modal area
+            eventArgs.Cancel = eventArgs.CloseReason == CloseReason.FocusLostClosing;
+        }
+
         protected virtual async Task OpenEditModalAsync(TListViewModel entity)
         {
             try
             {
                 EditValidationsRef?.ClearAll();
-            
+
                 await CheckUpdatePolicyAsync();
 
                 var entityDto = await AppService.GetAsync(entity.Id);
@@ -377,6 +383,12 @@ namespace Volo.Abp.BlazoriseUI
             return Task.CompletedTask;
         }
 
+        protected virtual void ClosingEditModal(ModalClosingEventArgs eventArgs)
+        {
+            // cancel close if clicked outside of modal area
+            eventArgs.Cancel = eventArgs.CloseReason == CloseReason.FocusLostClosing;
+        }
+
         protected virtual async Task CreateEntityAsync()
         {
             try
diff --git a/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor b/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor
index 16e767768d..057b6533e3 100644
--- a/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor
+++ b/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor
@@ -3,8 +3,8 @@
 
 @inherits AbpFeatureManagementComponentBase
 
-<Modal @ref="Modal">
-    <ModalContent Size="ModalSize.Large" IsCentered="true">
+<Modal @ref="Modal" Closing="@ClosingModal">
+    <ModalContent Size="ModalSize.Large" Centered="true">
         <ModalHeader>
             <ModalTitle>@L["Features"]</ModalTitle>
             <CloseButton Clicked="CloseModal" />
diff --git a/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor.cs b/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor.cs
index bd2c85cf95..12c39dd94f 100644
--- a/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor.cs
+++ b/modules/feature-management/src/Volo.Abp.FeatureManagement.Blazor/Components/FeatureManagementModal.razor.cs
@@ -136,5 +136,10 @@ namespace Volo.Abp.FeatureManagement.Blazor.Components
             var resource = LocalizationOptions.Value.Resources.Values.FirstOrDefault(x => x.ResourceName == resourceName);
             return HtmlLocalizerFactory.Create(resource != null ? resource.ResourceType : LocalizationOptions.Value.DefaultResourceType);
         }
+
+        protected virtual void ClosingModal( ModalClosingEventArgs eventArgs )
+        {
+            eventArgs.Cancel = eventArgs.CloseReason == CloseReason.FocusLostClosing;
+        }
     }
 }
diff --git a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor
index e1ff5e8aa6..423e1f5ebf 100644
--- a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor
+++ b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor
@@ -75,7 +75,7 @@
 @* ************************* CREATE MODAL ************************* *@
 @if (HasCreatePermission)
 {
-    <Modal @ref="CreateModal">
+    <Modal @ref="CreateModal" Closing="@ClosingCreateModal">
         <ModalContent Centered="true">
             <Form>
                 <ModalHeader>
@@ -111,7 +111,7 @@
 @* ************************* EDIT MODAL ************************* *@
 @if (HasUpdatePermission)
 {
-    <Modal @ref="EditModal">
+    <Modal @ref="EditModal" Closing="@ClosingEditModal">
         <ModalContent Centered="true">
             <Form>
                 <ModalHeader>
diff --git a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/UserManagement.razor b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/UserManagement.razor
index 3ccd6314e4..891cf321d6 100644
--- a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/UserManagement.razor
+++ b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/UserManagement.razor
@@ -75,7 +75,7 @@
 @* ************************* CREATE MODAL ************************* *@
 @if ( HasCreatePermission )
 {
-    <Modal @ref="CreateModal">
+    <Modal @ref="CreateModal" Closing="@ClosingCreateModal">
         <ModalContent Centered="true">
             <Form>
                 <ModalHeader>
@@ -183,7 +183,7 @@
 @* ************************* EDIT MODAL ************************* *@
 @if ( HasUpdatePermission )
 {
-    <Modal @ref="EditModal">
+    <Modal @ref="EditModal" Closing="@ClosingEditModal">
         <ModalContent Centered="true">
             <Form>
                 <ModalHeader>
diff --git a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor
index fcbf323e79..1fcd5eb3d3 100644
--- a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor
+++ b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor
@@ -1,8 +1,8 @@
 @using Microsoft.Extensions.Localization
 @using Volo.Abp.PermissionManagement.Localization
 @inherits Volo.Abp.AspNetCore.Components.AbpComponentBase
-<Modal @ref="_modal">
-    <ModalContent Size="ModalSize.Large" IsCentered="true">
+<Modal @ref="_modal" Closing="@ClosingModal">
+    <ModalContent Size="ModalSize.Large" Centered="true">
         <ModalHeader>
             <ModalTitle>@L["Permissions"] - @_entityDisplayName</ModalTitle>
             <CloseButton Clicked="CloseModal" />
diff --git a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs
index 35acb50651..55d2b36ed6 100644
--- a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs
+++ b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs
@@ -230,5 +230,10 @@ namespace Volo.Abp.PermissionManagement.Blazor.Components
                     .JoinAsString(", ")
             );
         }
+
+        protected virtual void ClosingModal(ModalClosingEventArgs eventArgs)
+        {
+            eventArgs.Cancel = eventArgs.CloseReason == CloseReason.FocusLostClosing;
+        }
     }
 }
diff --git a/modules/tenant-management/src/Volo.Abp.TenantManagement.Blazor/Pages/TenantManagement/TenantManagement.razor b/modules/tenant-management/src/Volo.Abp.TenantManagement.Blazor/Pages/TenantManagement/TenantManagement.razor
index c7ee7e137e..c1c1ff15f0 100644
--- a/modules/tenant-management/src/Volo.Abp.TenantManagement.Blazor/Pages/TenantManagement/TenantManagement.razor
+++ b/modules/tenant-management/src/Volo.Abp.TenantManagement.Blazor/Pages/TenantManagement/TenantManagement.razor
@@ -66,7 +66,7 @@
 @* ************************* CREATE MODAL ************************* *@
 @if ( HasCreatePermission )
 {
-    <Modal @ref="CreateModal">
+    <Modal @ref="CreateModal" Closing="@ClosingCreateModal">
         <ModalContent Centered="true">
             <Form>
                 <ModalHeader>
@@ -119,7 +119,7 @@
 @* ************************* EDIT MODAL ************************* *@
 @if ( HasUpdatePermission )
 {
-    <Modal @ref="EditModal">
+    <Modal @ref="EditModal" Closing="@ClosingEditModal">
         <ModalContent Centered="true">
             <Form>
                 <ModalHeader>