diff --git a/src/assets/icon/icon.tsx b/src/assets/icon/icon.tsx
index 2b70a08..5fbaba4 100644
--- a/src/assets/icon/icon.tsx
+++ b/src/assets/icon/icon.tsx
@@ -17,7 +17,7 @@ const X = () => (
   >
     <path
       d="M4 12L12 4M4 4L12 12"
-      stroke="#85899E"
+      stroke="currentColor"
       stroke-linecap="round"
       stroke-linejoin="round"
     />
@@ -63,7 +63,7 @@ const PencilAlt = () => (
   >
     <path
       d="M7.33329 3.33334H3.99996C3.26358 3.33334 2.66663 3.93029 2.66663 4.66667V12C2.66663 12.7364 3.26358 13.3333 3.99996 13.3333H11.3333C12.0697 13.3333 12.6666 12.7364 12.6666 12V8.66667M11.7238 2.39052C12.2445 1.86983 13.0887 1.86983 13.6094 2.39052C14.1301 2.91122 14.1301 3.75544 13.6094 4.27614L7.88557 10H5.99996L5.99996 8.11438L11.7238 2.39052Z"
-      stroke="#85899E"
+      stroke="currentColor"
       stroke-linecap="round"
       stroke-linejoin="round"
     />
@@ -86,7 +86,7 @@ const Refresh = () => (
   >
     <path
       d="M2.66663 2.66669V6.00002H3.0543M13.292 7.33335C12.964 4.70248 10.7197 2.66669 7.99996 2.66669C5.76171 2.66669 3.84549 4.04547 3.0543 6.00002M3.0543 6.00002H5.99996M13.3333 13.3334V10H12.9456M12.9456 10C12.1544 11.9546 10.2382 13.3334 7.99996 13.3334C5.28021 13.3334 3.03595 11.2976 2.70789 8.66669M12.9456 10H9.99996"
-      stroke="#85899E"
+      stroke="currentColor"
       stroke-linecap="round"
       stroke-linejoin="round"
     />
diff --git a/src/components/Contro.css b/src/components/Contro.css
index 8b68c55..77c8f68 100644
--- a/src/components/Contro.css
+++ b/src/components/Contro.css
@@ -56,6 +56,18 @@
   padding: 4px;
 }
 
+.icon-p svg {
+  color: #85899E;
+}
+
 .Contro-cont span.anticon:hover {
   background: #F0F1F3;
-}
\ No newline at end of file
+}
+
+.grey-icon svg {
+  color: #85899E;
+}
+
+.icon-active:active svg {
+  color: #F28B44;
+}
diff --git a/src/components/Contro.tsx b/src/components/Contro.tsx
index 57a5c04..8599a4d 100644
--- a/src/components/Contro.tsx
+++ b/src/components/Contro.tsx
@@ -98,7 +98,7 @@ export const Contro: React.FC<ControProps> = () => {
                 />
                 <div className="Contro-handle-icon">
                   <XIcon
-                    className="icon-p"
+                    className="grey-icon icon-p icon-active"
                     onClick={() => {
                       setIsEdit(false);
                     }}
@@ -132,7 +132,7 @@ export const Contro: React.FC<ControProps> = () => {
                 <div className="Contro-handle-icon">
                   <Tooltip title="修改监听端口">
                     <PencilAltIcon
-                      className="icon-p"
+                      className="grey-icon icon-p icon-active"
                       onClick={() => {
                         setIsEdit(true);
                         setEnginePortTemp(enginePort);
@@ -148,6 +148,7 @@ export const Contro: React.FC<ControProps> = () => {
                   {failConnected && (
                     <Tooltip title="重新连接">
                       <RefreshIcon
+                        className="grey-icon icon-active"
                         onClick={() => {
                           if (enginePort) {
                             wsc.connect(Number(enginePort));