diff --git a/config/webpack.dev.js b/config/webpack.dev.js
index 0552b56f..6bd7f72b 100644
--- a/config/webpack.dev.js
+++ b/config/webpack.dev.js
@@ -109,6 +109,7 @@ module.exports = (env) => {
               options: {
                 importLoaders: true,
                 javascriptEnabled: true,
+                modifyVars: theme,
               },
             },
           ],
diff --git a/config/webpack.e2e.js b/config/webpack.e2e.js
index 0dfeed4e..e092fb36 100644
--- a/config/webpack.e2e.js
+++ b/config/webpack.e2e.js
@@ -97,6 +97,7 @@ module.exports = (env) => {
               options: {
                 importLoaders: true,
                 javascriptEnabled: true,
+                modifyVars: theme,
               },
             },
           ],
diff --git a/config/webpack.prod.js b/config/webpack.prod.js
index af9535bb..ca0b96c3 100644
--- a/config/webpack.prod.js
+++ b/config/webpack.prod.js
@@ -86,6 +86,7 @@ module.exports = (env) => {
               options: {
                 importLoaders: true,
                 javascriptEnabled: true,
+                modifyVars: theme,
               },
             },
           ],
diff --git a/src/containers/TabDetail/index.less b/src/containers/TabDetail/index.less
index c0c680a5..8aa1267e 100644
--- a/src/containers/TabDetail/index.less
+++ b/src/containers/TabDetail/index.less
@@ -74,7 +74,7 @@
   padding-right: @body-padding;
   padding-bottom: 30px;
   padding-left: @body-padding;
-  background-color: #fff;
+  background-color: @white;
 
   :global {
     .ant-descriptions-title {
@@ -134,7 +134,7 @@
   :global {
     .ant-btn-link {
       padding: 5.6px 15px !important;
-      border-color: #0068ff;
+      border-color: @primary-color;
     }
 
     .ant-divider-vertical {
@@ -142,9 +142,9 @@
     }
 
     .ant-btn-dangerous {
-      color: #c4233e;
+      color: @danger-color;
       background: transparent;
-      border-color: #c4233e;
+      border-color: @danger-color;
     }
 
     .ant-btn-link[disabled],
@@ -155,16 +155,16 @@
     }
 
     .ant-btn-dangerous.ant-btn-link:active {
-      color: #c4233e;
+      color: @danger-color;
       background: transparent;
-      border-color: #c4233e;
+      border-color: @danger-color;
     }
 
     .ant-btn-dangerous:hover,
     .ant-btn-dangerous:focus {
-      color: #f76070;
-      background: #fff;
-      border-color: #f76070;
+      color: @danger-color-hover;
+      background: @white;
+      border-color: @danger-color-hover;
     }
   }
 }
diff --git a/src/styles/variables.less b/src/styles/variables.less
index 76d29ccc..2188e2ed 100644
--- a/src/styles/variables.less
+++ b/src/styles/variables.less
@@ -20,6 +20,8 @@
 @red-2: rgba(235, 53, 77, 65%);
 @red-3: rgba(235, 53, 77, 35%);
 @error-color: @red-1;
+@danger-color: #c4233e;
+@danger-color-hover: #f76070;
 
 @gray-1: #d2d2d2;
 @gray-2: #f2f2f2;