diff --git a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/Extension/Ext+UIColor.swift b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/Extension/Ext+UIColor.swift
new file mode 100644
index 0000000000..7c2cfcc857
--- /dev/null
+++ b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/Extension/Ext+UIColor.swift
@@ -0,0 +1,14 @@
+//
+//  Ext+UIColor.swift
+//  Intelligents
+//
+//  Created by 秋星桥 on 2024/12/13.
+//
+
+import UIKit
+
+extension UIColor {
+  static var accent: UIColor {
+    .accent
+  }
+}
diff --git a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+BaseCell.swift b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+BaseCell.swift
index 8c41782ea6..0f2a4b2372 100644
--- a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+BaseCell.swift
+++ b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+BaseCell.swift
@@ -27,11 +27,16 @@ extension ChatTableView {
       didSet { update(via: viewModel) }
     }
 
-    var isBackgroundColorActivated = false {
+    enum BackgroundColorType {
+      case clear
+      case highlight
+      case warning
+      case lightGray
+    }
+
+    var backgroundColorType: BackgroundColorType = .clear {
       didSet {
-        roundedBackgroundView.backgroundColor = isBackgroundColorActivated
-          ? .systemGray.withAlphaComponent(0.25)
-          : .clear
+        roundedBackgroundView.backgroundColor = backgroundColorType.color
       }
     }
 
@@ -40,6 +45,10 @@ extension ChatTableView {
       selectionStyle = .none
       backgroundColor = .clear
 
+      roundedBackgroundView.clipsToBounds = true
+      roundedBackgroundView.layer.cornerRadius = 8
+      roundedBackgroundView.layer.masksToBounds = true
+
       contentView.addSubview(roundedBackgroundView)
       roundedBackgroundView.translatesAutoresizingMaskIntoConstraints = false
       [ // inset half of the container view
@@ -74,3 +83,18 @@ extension ChatTableView {
     }
   }
 }
+
+extension ChatTableView.BaseCell.BackgroundColorType {
+  var color: UIColor {
+    switch self {
+    case .clear:
+      .clear
+    case .highlight:
+      .accent
+    case .warning:
+      .systemRed.withAlphaComponent(0.1)
+    case .lightGray:
+      .systemGray.withAlphaComponent(0.1)
+    }
+  }
+}
diff --git a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+ChatCell.swift b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+ChatCell.swift
index ff5b956fe3..954dfdaac6 100644
--- a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+ChatCell.swift
+++ b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/Cell/ChatTableView+ChatCell.swift
@@ -68,12 +68,15 @@ extension ChatTableView {
       case .system:
         avatarView.image = UIImage(systemName: "gearshape.fill")
         titleLabel.text = "System".localized()
+        backgroundColorType = .warning
       case .assistant:
         avatarView.image = UIImage(named: "spark", in: .module, with: .none)
         titleLabel.text = "AFFiNE AI".localized()
+        backgroundColorType = .lightGray
       case .user:
         avatarView.image = UIImage(systemName: "person.fill")
         titleLabel.text = "You".localized()
+        backgroundColorType = .clear
       }
 
       removableConstraints.forEach { $0.isActive = false }
diff --git a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/ChatTableView.swift b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/ChatTableView.swift
index 99d46776c0..4a97165701 100644
--- a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/ChatTableView.swift
+++ b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/IntelligentsChatController/ChatTableView/ChatTableView.swift
@@ -40,6 +40,19 @@ class ChatTableView: UIView {
     foot.widthAnchor.constraint(equalToConstant: 200).isActive = true
     tableView.tableFooterView = foot
 
+    tableView.separatorStyle = .none
+
+    putMockData()
+  }
+
+  @available(*, unavailable)
+  required init?(coder _: NSCoder) {
+    fatalError()
+  }
+}
+
+extension ChatTableView {
+  func putMockData() {
     DispatchQueue.main.async {
       self.dataSource = [
         .init(type: .chat, object: ChatCell.ViewModel(
@@ -85,9 +98,4 @@ class ChatTableView: UIView {
       self.tableView.reloadData()
     }
   }
-
-  @available(*, unavailable)
-  required init?(coder _: NSCoder) {
-    fatalError()
-  }
 }
diff --git a/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/Resources/Media.xcassets/accent.colorset/Contents.json b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/Resources/Media.xcassets/accent.colorset/Contents.json
new file mode 100644
index 0000000000..e968c86373
--- /dev/null
+++ b/packages/frontend/apps/ios/App/App/Packages/Intelligents/Sources/Intelligents/Resources/Media.xcassets/accent.colorset/Contents.json
@@ -0,0 +1,20 @@
+{
+  "colors": [
+    {
+      "color": {
+        "color-space": "srgb",
+        "components": {
+          "alpha": "1.000",
+          "blue": "228",
+          "green": "148",
+          "red": "72"
+        }
+      },
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  }
+}