diff --git a/web/src/pages/chat/chat-container/index.less b/web/src/pages/chat/chat-container/index.less
index 502d33268..71fe92a70 100644
--- a/web/src/pages/chat/chat-container/index.less
+++ b/web/src/pages/chat/chat-container/index.less
@@ -27,8 +27,18 @@
   .messageText {
     .chunkText();
     padding: 0 14px;
-    background-color: rgba(249, 250, 251, 1);
+    background-color: rgb(230, 230, 232);
     word-break: break-all;
+    border-radius: 10px;
+  }
+  .messageUserText {
+    .chunkText();
+    padding: 0 14px;
+    background-color: rgb(45, 100, 245);
+    word-break: break-all;
+    border-radius: 10px;
+    color: #fdfdfd;
+    text-align: justify;
   }
   .messageEmpty {
     width: 300px;
diff --git a/web/src/pages/chat/chat-container/index.tsx b/web/src/pages/chat/chat-container/index.tsx
index 96b6cdf17..28803ce54 100644
--- a/web/src/pages/chat/chat-container/index.tsx
+++ b/web/src/pages/chat/chat-container/index.tsx
@@ -14,7 +14,7 @@ import {
   useFetchConversationOnMount,
   useGetFileIcon,
   useGetSendButtonDisabled,
-  useSelectConversationLoading,
+  useSelectConversationLoading, useSendButtonDisabled,
   useSendMessage,
 } from '../hooks';
 import MarkdownContent from '../markdown-content';
@@ -87,7 +87,7 @@ const MessageItem = ({
           )}
           <Flex vertical gap={8} flex={1}>
             <b>{isAssistant ? '' : userInfo.nickname}</b>
-            <div className={styles.messageText}>
+            <div className={isAssistant ? styles.messageText : styles.messageUserText}>
               <MarkdownContent
                 content={content}
                 reference={reference}
@@ -157,6 +157,7 @@ const ChatContainer = () => {
   const { visible, hideModal, documentId, selectedChunk, clickDocumentButton } =
     useClickDrawer();
   const disabled = useGetSendButtonDisabled();
+  const sendDisabled = useSendButtonDisabled(value);
   useGetFileIcon();
   const loading = useSelectConversationLoading();
   const { t } = useTranslate('chat');
@@ -196,7 +197,7 @@ const ChatContainer = () => {
               type="primary"
               onClick={handlePressEnter}
               loading={sendLoading}
-              disabled={disabled}
+              disabled={sendDisabled}
             >
               {t('send')}
             </Button>
diff --git a/web/src/pages/chat/hooks.ts b/web/src/pages/chat/hooks.ts
index 115174f84..288eaef88 100644
--- a/web/src/pages/chat/hooks.ts
+++ b/web/src/pages/chat/hooks.ts
@@ -54,6 +54,7 @@ import {
 } from './interface';
 import { ChatModelState } from './model';
 import { isConversationIdExist } from './utils';
+import {public_path} from "@/utils/api";
 
 export const useSelectCurrentDialog = () => {
   const currentDialog: IDialog = useSelector(
@@ -630,6 +631,7 @@ export const useSendMessage = (
     handlePressEnter,
     handleInputChange,
     value,
+    setValue,
     loading: !done,
   };
 };
@@ -762,6 +764,10 @@ export const useGetSendButtonDisabled = () => {
 
   return dialogId === '' && conversationId === '';
 };
+
+export const useSendButtonDisabled = (value: string) => {
+  return value === '';
+};
 //#endregion
 
 //#region API provided for external calls
diff --git a/web/src/pages/chat/share/index.less b/web/src/pages/chat/share/index.less
index 1a0e52a6f..cc2683033 100644
--- a/web/src/pages/chat/share/index.less
+++ b/web/src/pages/chat/share/index.less
@@ -33,8 +33,18 @@
   .messageText {
     .chunkText();
     padding: 0 14px;
-    background-color: rgba(249, 250, 251, 1);
+    background-color: rgb(230, 230, 232);
     word-break: break-all;
+    border-radius: 10px;
+  }
+  .messageUserText {
+    .chunkText();
+    padding: 0 14px;
+    background-color: rgb(45, 100, 245);
+    word-break: break-all;
+    border-radius: 10px;
+    color: #fdfdfd;
+    text-align: justify;
   }
   .messageEmpty {
     width: 300px;
diff --git a/web/src/pages/chat/share/large.tsx b/web/src/pages/chat/share/large.tsx
index 4c0d986c9..110402a9b 100644
--- a/web/src/pages/chat/share/large.tsx
+++ b/web/src/pages/chat/share/large.tsx
@@ -19,6 +19,7 @@ import {
 } from '../shared-hooks';
 import { buildMessageItemReference } from '../utils';
 import styles from './index.less';
+import {useSendButtonDisabled} from "@/pages/chat/hooks";
 
 const MessageItem = ({
   item,
@@ -76,7 +77,7 @@ const MessageItem = ({
           )}
           <Flex vertical gap={8} flex={1}>
             <b>{isAssistant ? '' : 'You'}</b>
-            <div className={styles.messageText}>
+            <div className={isAssistant ? styles.messageText : styles.messageUserText}>
               <MarkdownContent
                 reference={reference}
                 clickDocumentButton={() => {}}
@@ -149,6 +150,7 @@ const ChatContainer = () => {
     setCurrentConversation,
     addNewestAnswer,
   );
+  const sendDisabled = useSendButtonDisabled(value);
 
   return (
     <>
@@ -184,7 +186,7 @@ const ChatContainer = () => {
               type="primary"
               onClick={handlePressEnter}
               loading={sendLoading}
-              //   disabled={disabled}
+              disabled={sendDisabled}
             >
               {t('send')}
             </Button>
diff --git a/web/src/pages/chat/shared-hooks.ts b/web/src/pages/chat/shared-hooks.ts
index d406ff95d..5116c1938 100644
--- a/web/src/pages/chat/shared-hooks.ts
+++ b/web/src/pages/chat/shared-hooks.ts
@@ -133,6 +133,10 @@ export const useSelectCurrentSharedConversation = (conversationId: string) => {
   };
 };
 
+export const useSendButtonDisabled = (value: string) => {
+  return value === '';
+};
+
 export const useSendSharedMessage = (
   conversation: IClientConversation,
   addNewestConversation: (message: string) => void,