diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js
index 7f78bdc4..23c00cfd 100644
--- a/config/webpack.config.dev.js
+++ b/config/webpack.config.dev.js
@@ -154,7 +154,7 @@ module.exports = {
                   {
                     libraryName: "antd",
                     libraryDirectory: "es",
-                    style: "css",
+                    style: true,
                   },
                 ],
               ],
@@ -212,6 +212,23 @@ module.exports = {
               },
             ],
           },
+          {
+            test: /\.less$/,
+            use: [{
+              loader: 'style-loader',
+            }, {
+              loader: 'css-loader', // translates CSS into CommonJS
+            }, {
+              loader: 'less-loader', // compiles Less to CSS
+               options: {
+                 modifyVars: {
+                   'primary-color': '#4154f1',
+                   'link-color': '#4154f1',
+                 },
+                 javascriptEnabled: true,
+               },
+            }]
+          },
           // "file" loader makes sure those assets get served by WebpackDevServer.
           // When you `import` an asset, you get its (virtual) filename.
           // In production, they would get copied to the `build` folder.
diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js
index 467771a5..9f73041c 100644
--- a/config/webpack.config.prod.js
+++ b/config/webpack.config.prod.js
@@ -148,7 +148,7 @@ module.exports = {
                   {
                     libraryName: "antd",
                     libraryDirectory: "es",
-                    style: "css",
+                    style: true,
                   },
                 ],
               ],
@@ -211,6 +211,23 @@ module.exports = {
               },
             ],
           },
+          {
+            test: /\.less$/,
+            use: [{
+              loader: 'style-loader',
+            }, {
+              loader: 'css-loader', // translates CSS into CommonJS
+            }, {
+              loader: 'less-loader', // compiles Less to CSS
+               options: {
+                 modifyVars: {
+                   'primary-color': '#4154f1',
+                   'link-color': '#4154f1',
+                 },
+                 javascriptEnabled: true,
+               },
+            }]
+          },
           // "file" loader makes sure assets end up in the `build` folder.
           // When you `import` an asset, you get its filename.
           // This loader doesn't use a "test" so it will catch all modules
diff --git a/package.json b/package.json
index 2cc06ce8..55006e4e 100644
--- a/package.json
+++ b/package.json
@@ -198,6 +198,8 @@
     "concat": "^1.0.3",
     "cross-env": "^7.0.3",
     "happypack": "^5.0.1",
+    "less": "^3.9.0",
+    "less-loader": "^4.1.0",
     "mockjs": "^1.1.0",
     "node-sass": "^4.12.0",
     "optimize-css-assets-webpack-plugin": "^5.0.3",