diff --git a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_ai_message.dart b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_ai_message.dart
index 5a8e65012d..7a19360490 100644
--- a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_ai_message.dart
+++ b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_ai_message.dart
@@ -48,9 +48,8 @@ class ChatAIMessageBubble extends StatelessWidget {
             mainAxisSize: MainAxisSize.min,
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              ChatBorderedCircleAvatar(
-                backgroundColor: Theme.of(context).colorScheme.secondary,
-                child: const FlowySvg(
+              const ChatBorderedCircleAvatar(
+                child: FlowySvg(
                   FlowySvgs.flowy_ai_chat_logo_s,
                   size: Size.square(24),
                 ),
diff --git a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_avatar.dart b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_avatar.dart
index 141432520b..7f2e01f989 100644
--- a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_avatar.dart
+++ b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_avatar.dart
@@ -24,13 +24,11 @@ class ChatBorderedCircleAvatar extends StatelessWidget {
     super.key,
     this.border = const BorderSide(),
     this.backgroundImage,
-    this.backgroundColor,
     this.child,
   });
 
   final BorderSide border;
   final ImageProvider<Object>? backgroundImage;
-  final Color? backgroundColor;
   final Widget? child;
 
   @override
@@ -41,7 +39,8 @@ class ChatBorderedCircleAvatar extends StatelessWidget {
         constraints: const BoxConstraints.expand(),
         child: CircleAvatar(
           backgroundImage: backgroundImage,
-          backgroundColor: backgroundColor,
+          backgroundColor:
+              Theme.of(context).colorScheme.surfaceContainerHighest,
           child: child,
         ),
       ),
@@ -118,7 +117,7 @@ class ChatUserAvatar extends StatelessWidget {
           shape: BoxShape.circle,
           border: isHovering
               ? Border.all(
-                  color: Theme.of(context).colorScheme.primary,
+                  color: Theme.of(context).colorScheme.secondary,
                   width: 4,
                 )
               : null,
diff --git a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_input.dart b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_input.dart
index a981ab9b33..b33c59d640 100644
--- a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_input.dart
+++ b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_input.dart
@@ -269,7 +269,8 @@ class SendButton extends StatelessWidget {
   Widget build(BuildContext context) {
     return FlowyIconButton(
       width: 36,
-      fillColor: Theme.of(context).colorScheme.secondary,
+      fillColor: AFThemeExtension.of(context).lightGreyHover,
+      hoverColor: AFThemeExtension.of(context).lightGreyHover,
       radius: BorderRadius.circular(18),
       icon: FlowySvg(
         FlowySvgs.send_s,
diff --git a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_user_message.dart b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_user_message.dart
index f6e55b8090..3e1e4e6c24 100644
--- a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_user_message.dart
+++ b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_user_message.dart
@@ -25,7 +25,8 @@ class ChatUserMessageBubble extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     const borderRadius = BorderRadius.all(Radius.circular(6));
-    final backgroundColor = Theme.of(context).colorScheme.secondary;
+    final backgroundColor =
+        Theme.of(context).colorScheme.surfaceContainerHighest;
 
     return BlocProvider(
       create: (context) => ChatUserMessageBloc(message: message),