diff --git a/web-react/src/assets/style/dark/main.less b/web-react/src/assets/style/dark/main.less
index d264d6b..6e9fb0b 100644
--- a/web-react/src/assets/style/dark/main.less
+++ b/web-react/src/assets/style/dark/main.less
@@ -547,10 +547,13 @@
         line-height: @layout-header-height - 16px;
 
         height: @layout-header-height - 20px;
+
+        color: fade(@black, 35%);
         .anticon {
           color: fade(@black, 35%);
         }
         &:hover {
+          color: @icon-color-hover;
           background-color: fade(@black, 5%);
           .anticon {
             color: @icon-color-hover;
@@ -596,10 +599,12 @@
     }
     .header-actions {
       .header-action {
+        color: fade(@white, 60%);
         .anticon {
           color: fade(@white, 60%);
         }
         &:hover {
+          color: @white;
           background-color: fade(@white, 20%);
           .anticon {
             color: @white;
diff --git a/web-react/src/assets/style/default/main.less b/web-react/src/assets/style/default/main.less
index 112f21b..f4b6848 100644
--- a/web-react/src/assets/style/default/main.less
+++ b/web-react/src/assets/style/default/main.less
@@ -541,10 +541,13 @@
         line-height: @layout-header-height - 16px;
 
         height: @layout-header-height - 20px;
+
+        color: fade(@black, 35%);
         .anticon {
           color: fade(@black, 35%);
         }
         &:hover {
+          color: @icon-color-hover;
           background-color: fade(@black, 5%);
           .anticon {
             color: @icon-color-hover;
@@ -590,10 +593,12 @@
     }
     .header-actions {
       .header-action {
+        color: fade(@white, 60%);
         .anticon {
           color: fade(@white, 60%);
         }
         &:hover {
+          color: @white;
           background-color: fade(@white, 20%);
           .anticon {
             color: @white;