diff --git a/packages/devextreme-scss/scss/widgets/base/chat/layout/chat-messagelist/_index.scss b/packages/devextreme-scss/scss/widgets/base/chat/layout/chat-messagelist/_index.scss
index afae75f02a68..0101d8e6b773 100644
--- a/packages/devextreme-scss/scss/widgets/base/chat/layout/chat-messagelist/_index.scss
+++ b/packages/devextreme-scss/scss/widgets/base/chat/layout/chat-messagelist/_index.scss
@@ -47,6 +47,10 @@
 }
 
 .dx-chat-messagelist-empty {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+
   .dx-scrollview-content {
     display: flex;
     height: 100%;
diff --git a/packages/devextreme-scss/scss/widgets/fluent/chat/_colors.scss b/packages/devextreme-scss/scss/widgets/fluent/chat/_colors.scss
index 5f884d9f71ba..bbfb29fb2f23 100644
--- a/packages/devextreme-scss/scss/widgets/fluent/chat/_colors.scss
+++ b/packages/devextreme-scss/scss/widgets/fluent/chat/_colors.scss
@@ -139,7 +139,7 @@ $chat-suggestions-box-shadow: null !default;
 
   $chat-messagelist-day-header-color: color.adjust($base-bg, $lightness: -56.08%, $space: hsl) !default;
   $chat-messagelist-empty-icon-color: color.adjust($base-icon-color, $lightness: 32.16%, $space: hsl) !default;
-  $chat-messagelist-empty-icon-background-color: color.adjust($base-bg, $lightness: 3.92%, $space: hsl) !default;
+  $chat-messagelist-empty-icon-background-color: color.adjust($base-bg, $lightness: -3.92%, $space: hsl) !default;
   $chat-messagelist-empty-prompt-color: color.adjust($base-label-color, $lightness: -5.88%, $space: hsl) !default;
 
   $chat-typingindicator-circle-bg-color: color.adjust($base-bg, $lightness: -29.16%, $space: hsl) !default;