diff --git a/examples/routers/search.vue b/examples/routers/search.vue
index 8d8298bf6f73b6bc27daac67470cdbb8880a5d59..c52722444222b5bbb048b469d16ab48dba9561b6 100644
--- a/examples/routers/search.vue
+++ b/examples/routers/search.vue
@@ -135,6 +135,17 @@
         style="width: 200px"
         @on-submit="handleSubmit"
       />
+      <e-search
+        class="filter-search-component"
+        disabled
+        clearable
+        placeholder="请输入"
+        style="width: 300px"
+        :filter-items="cityList"
+        :filter-value="filterValue"
+        @on-submit="handleSubmit"
+        @on-select="handleSelect"
+      />
     </div>
     <div class="demo-inner-divider">筛选搜索</div>
     <span class="demo-description">
@@ -225,6 +236,9 @@ export default {
   .button-search-component:not(:first-child) {
     margin-left: 20px;
   }
+  .filter-search-component:not(:first-child) {
+    margin-left: 20px;
+  }
 }
 
 .markdown-body {
diff --git a/src/styles/components/search.less b/src/styles/components/search.less
index d877c866140dd8fa0a4ac9e59635e2dc3afa05dd..0fe013c7532e32eaaf0f4938a63bc2510adad710 100644
--- a/src/styles/components/search.less
+++ b/src/styles/components/search.less
@@ -3,6 +3,10 @@
 @input-group-prefix-cls: ~'@{css-prefix}input-group';
 
 .@{search-prefix-cls} {
+  .haloe-icon-close-circle-filled:before {
+    color: @search-icon-close-circle;
+  }
+  
   .@{input-prefix-cls} {
     &-no-border {
       border: none;
@@ -16,7 +20,7 @@
       padding: 0 10px !important;
       background: @color-functional-white !important;
       color: @color-complementary-5 !important;
-      border-color: @color-complementary-7 !important;
+      border-color: @color-scrollbar !important;
 
       &:hover {
         color: @color-brand-primary !important;
@@ -44,15 +48,27 @@
   }
 
   &-disabled {
+    .haloe-icon-search:before {
+      color: @search-icon-disabled-prefix !important;
+    }
+    .haloe-select-selected-value {
+      color: @search-icon-disabled-prefix !important;
+    }
+    .haloe-select-selection:hover {
+      border-color: @color-border-disable !important;
+    }
     .@{input-prefix-cls} {
       border-color: @color-complementary-7 !important;
       &-search,
       &-search:hover {
         cursor: @cursor-disabled;
         background: @color-complementary-8 !important;
-        color: @color-complementary-5 !important;
-        border-color: @color-complementary-7 !important;
+        color: @search-icon-disabled-prefix !important;
+        border-color: @color-border-disable !important;
       }
     }
   }
+  .haloe-input-wrapper-disabled .haloe-input:not(.haloe-input-no-border) {
+    border: 1px solid @color-border-disable !important;
+  }
 }
diff --git a/src/styles/var.less b/src/styles/var.less
index a3c5c6ee27f8e62481e6cb684068f54c1fe26825..5c56bcb7ea3452ed810c1385a35dd6d29460958f 100644
--- a/src/styles/var.less
+++ b/src/styles/var.less
@@ -446,3 +446,8 @@
 @upload-color-bg-disable: #F5F5F6;
 @upload-color-text-disable: #9D9EA9;
 @upload-color-border-disable: #D7D8DC;
+
+
+// search
+@search-icon-close-circle: #bbb;
+@search-icon-disabled-prefix: #999;
\ No newline at end of file