diff --git a/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx b/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx
index e8ef37205d..558e0e4385 100644
--- a/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx
+++ b/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx
@@ -23,15 +23,19 @@ export const FilterGroup = connect((props) => {
   return (
     <FilterLogicContext.Provider value={logic}>
       <div
-        style={bordered ? {
-          position: 'relative',
-          border: '1px dashed #dedede',
-          padding: 14,
-          marginBottom: 8,
-        } : {
-          position: 'relative',
-          marginBottom: 8,
-        }}
+        style={
+          bordered
+            ? {
+                position: 'relative',
+                border: '1px dashed #dedede',
+                padding: 14,
+                marginBottom: 8,
+              }
+            : {
+                position: 'relative',
+                marginBottom: 8,
+              }
+        }
       >
         {remove && (
           <a>
@@ -40,6 +44,7 @@ export const FilterGroup = connect((props) => {
                 position: 'absolute',
                 right: 10,
                 top: 10,
+                color: '#bfbfbf',
               }}
               onClick={() => remove()}
             />
diff --git a/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx b/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx
index e47e6c79c1..983866db41 100644
--- a/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx
+++ b/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx
@@ -49,7 +49,7 @@ export const FilterItem = observer((props: any) => {
             },
           })}
         <a>
-          <CloseCircleOutlined onClick={() => remove()} />
+          <CloseCircleOutlined onClick={() => remove()} style={{ color: '#bfbfbf' }} />
         </a>
       </Space>
     </div>