diff --git a/webpack.mix.js b/webpack.mix.js
index 1aca96b307c90af85441a654423ddaaae92acebd..6da64d55a9608aa1de7e4585f2fc76cb44b81549 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -2,8 +2,8 @@
 const { mix } = require('laravel-mix');
 
 
-// This generates a file called app.css, which we use
-// later on to build all.css
+// // This generates a file called app.css, which we use
+// // later on to build all.css
 mix
     .options(
         {
@@ -23,7 +23,7 @@ mix
     'public/css/bootstrap-tables-sticky-header.css',
     'public/css/overrides.css'
 ],
-    './public/css/dist/all.css')
+    './public/css/dist/all.css');
 
 // jQuery is loaded from vue.js webpack process
 // This compiles the vue.js file in the build directory
@@ -53,3 +53,22 @@ mix
 mix.copy('./public/css/dist/all.css', './public/css/build/all.css').copy('./public/js/dist/all.js', './public/js/build/all.js');
 
 mix.version();
+
+mix.less('resources/assets/less/skins/skin-blue.less', 'css/skins', './public/css/skins/skin-blue.css');
+mix.less('resources/assets/less/skins/skin-red.less', 'css/skins', './public/css/skins/skin-red.css');
+mix.less('resources/assets/less/skins/skin-contrast.less', 'css/skins', './public/css/skins/skin-contrast.css');
+mix.less('resources/assets/less/skins/skin-green.less', 'css/skins', './public/css/skins/skin-green.css');
+mix.less('resources/assets/less/skins/skin-green-dark.less', 'css/skins', './public/css/skins/skin-green-light.css');
+mix.less('resources/assets/less/skins/skin-black.less', 'css/skins', './public/css/skins/skin-black.css');
+mix.less('resources/assets/less/skins/skin-black-dark.less', 'css/skins', './public/css/skins/skin-black-light.css');
+mix.less('resources/assets/less/skins/skin-red-dark.less', 'css/skins', './public/css/skins/skin-red-light.css');
+mix.less('resources/assets/less/skins/skin-purple.less', 'css/skins', './public/css/skins/skin-purple.css');
+mix.less('resources/assets/less/skins/skin-purple-dark.less', 'css/skins', './public/css/skins/skin-purple-light.css');
+mix.less('resources/assets/less/skins/skin-yellow.less', 'css/skins', './public/css/skins/skin-yellow.css');
+mix.less('resources/assets/less/skins/skin-yellow-dark.less', 'css/skins', './public/css/skins/skin-yellow-light.css');
+mix.less('resources/assets/less/skins/skin-blue-dark.less', 'css/skins', './public/css/skins/skin-blue-light.css');
+mix.less('resources/assets/less/skins/skin-orange-dark.less', 'css/skins', './public/css/skins/skin-orange-light.css');
+mix.less('resources/assets/less/skins/skin-orange.less', 'css/skins', './public/css/skins/skin-orange.css');
+
+
+