diff --git a/.stylelintrc b/.stylelintrc
index e15f90b776..81bdd34ea7 100644
--- a/.stylelintrc
+++ b/.stylelintrc
@@ -1,4 +1,7 @@
 {
   "extends": "stylelint-config-standard",
+  "ignoreFiles": [
+    "./src/less/*-vendor.less"
+  ],
   "rules": { }
 }
\ No newline at end of file
diff --git a/package.json b/package.json
index 2f032a0840..93a29e155e 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,9 @@
     "package": "electron-forge package",
     "make": "electron-forge make",
     "publish": "electron-forge publish",
-    "style": "lessc --source-map-inline ./src/less/root.less ./static/css/root.css",
+    "tsc": "node ./tools/tsc.js",
+    "less": "node ./tools/lessc.js",
+    "contributors": "node ./tools/contributors.js",
     "lint-ts": "tslint -c tslint.json -p tsconfig.json -e \"node_modules/**/*.ts\"",
     "lint-style": "stylelint ./src/less/*.less"
   },
diff --git a/src/less/commands.less b/src/less/commands.less
index b6197ccd5a..a0ad731d8e 100644
--- a/src/less/commands.less
+++ b/src/less/commands.less
@@ -5,9 +5,11 @@
   justify-content: space-between;
   height: 40px;
   padding-top: 12px;
-  font-family: var(--default-fonts);
+  font-family: @default-fonts;
 
-  button, input, select {
+  button,
+  input,
+  select {
     -webkit-app-region: no-drag;
   }
 
@@ -20,7 +22,7 @@
     line-height: 15px;
   }
 
-  &>div {
+  & > div {
     display: flex;
 
     &:first-of-type {
@@ -29,7 +31,7 @@
       }
     }
 
-    &::last-of-type {
+    &:last-of-type {
       margin-right: 10px;
 
       button {
@@ -41,17 +43,16 @@
   .address-bar {
     height: 28px;
     width: 360px;
-    transition: width .4s;
+    transition: width 0.4s;
     display: flex;
 
-    &.empty {
-      width: 200px;
-    }
-
-    &::focus-within {
-      span, input {
-        border-color: @electron-bright;
-      }
+    input,
+    span {
+      font-family: @default-fonts;
+      font-weight: 300;
+      font-size: 11px;
+      cursor: auto;
+      -webkit-app-region: no-drag;
     }
 
     input {
@@ -77,7 +78,7 @@
       border-bottom-style: solid;
       border-bottom-left-radius: 4px;
       border-bottom-width: 1px;
-      border-image-outset: 0px;
+      border-image-outset: 0;
       border-image-repeat: stretch;
       border-image-slice: 100%;
       border-image-source: none;
@@ -89,22 +90,28 @@
       border-top-left-radius: 4px;
       border-top-style: solid;
       border-top-width: 1px;
-      color: rgb(0, 0, 0);
-      cursor: auto;
       display: inline-block;
-      font-family: system-ui;
-      font-size: 11px;
       height: 28px;
       letter-spacing: normal;
       line-height: 16px;
-      margin: 0 6px 0 0;
-      padding: 6px 6px 10px 10px;
+      margin: 0;
+      padding: 6px 0 10px 10px;
       user-select: text;
       width: 132px;
-      -webkit-app-region: no-drag;
       text-rendering: auto;
       text-shadow: none;
       text-transform: none;
     }
+
+    &.empty {
+      width: 200px;
+    }
+
+    &:focus-within {
+      span,
+      input {
+        border-color: @electron-bright;
+      }
+    }
   }
 }
diff --git a/src/less/dialogs.less b/src/less/dialogs.less
index bcb2dbaf82..075036bf40 100644
--- a/src/less/dialogs.less
+++ b/src/less/dialogs.less
@@ -18,11 +18,10 @@
 
 .tokenDialog {
   position: absolute;
-  z-index: 2;
   top: 60px;
   width: 300px;
   padding: 10px;
-  z-index: 1000;
+  z-index: 100;
   background-color: var(--electron-background-2);
   border: 1px solid var(--electron-dark);
   color: #f3f3f3;
diff --git a/src/less/main.less b/src/less/main.less
index 8e4287e160..225b57865b 100644
--- a/src/less/main.less
+++ b/src/less/main.less
@@ -12,7 +12,8 @@
   src: local('Roboto'), local('Roboto-Light'), url(../fonts/roboto/Roboto-Light.ttf) format('woff2');
 }
 
-html, body {
+html,
+body {
   padding: 0;
   margin: 0;
   background: @electron-background-2;
@@ -33,7 +34,7 @@ html, body {
   }
 
   *::-webkit-scrollbar-thumb {
-    background: rgba(255, 255, 255, .4);
+    background: rgba(255, 255, 255, 0.4);
   }
 
   *::-webkit-scrollbar-corner {
@@ -51,7 +52,7 @@ html, body {
     background-color: #9feaf9;
     border: none;
     color: #1e2527;
-    padding: 0px 30px;
+    padding: 0 30px;
     text-align: center;
     text-decoration: none;
     border-radius: 4px;
@@ -128,5 +129,3 @@ html, body {
   text-align: center;
   font-size: 12px;
 }
-
-
diff --git a/src/less/mosaic-vendor.less b/src/less/mosaic-vendor.less
index bd9c2c906c..a4f98111ec 100644
--- a/src/less/mosaic-vendor.less
+++ b/src/less/mosaic-vendor.less
@@ -20,23 +20,27 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- .mosaic {
+.mosaic {
   height: 100%;
   width: 100%;
 }
+
 .mosaic,
 .mosaic > * {
   box-sizing: border-box;
 }
+
 .mosaic .mosaic-zero-state {
   width: auto;
   height: auto;
   max-width: none;
   z-index: 1;
 }
+
 .mosaic .mosaic-zero-state .pt-non-ideal-state-icon .pt-icon {
   font-size: 120px;
 }
+
 .mosaic-root {
   position: absolute;
   top: 3px;
@@ -44,64 +48,80 @@
   bottom: 3px;
   left: 3px;
 }
+
 .mosaic-split {
   position: absolute;
   z-index: 1;
 }
+
 .mosaic-split:hover {
   background: black;
 }
+
 .mosaic-split .mosaic-split-line {
   position: absolute;
 }
+
 .mosaic-split.-row {
   margin-left: -3px;
   width: 6px;
   cursor: ew-resize;
 }
+
 .mosaic-split.-row .mosaic-split-line {
   top: 0;
   bottom: 0;
   left: 3px;
   right: 3px;
 }
+
 .mosaic-split.-column {
   margin-top: -3px;
   height: 6px;
   cursor: ns-resize;
 }
+
 .mosaic-split.-column .mosaic-split-line {
   top: 3px;
   bottom: 3px;
   left: 0;
   right: 0;
 }
+
 .mosaic-tile {
   position: absolute;
   margin: 3px;
 }
+
 .mosaic-tile > * {
   height: 100%;
   width: 100%;
 }
+
 .mosaic-drop-target {
   position: relative;
 }
+
 .mosaic-drop-target.drop-target-hover .drop-target-container {
   display: block;
 }
+
 .mosaic-drop-target.mosaic > .drop-target-container .drop-target.left {
   right: calc(100% -  10px );
 }
+
 .mosaic-drop-target.mosaic > .drop-target-container .drop-target.right {
   left: calc(100% -  10px );
 }
+
 .mosaic-drop-target.mosaic > .drop-target-container .drop-target.bottom {
   top: calc(100% -  10px );
 }
+
 .mosaic-drop-target.mosaic > .drop-target-container .drop-target.top {
   bottom: calc(100% -  10px );
 }
+
 .mosaic-drop-target .drop-target-container {
   position: absolute;
   top: 0;
@@ -110,9 +130,11 @@
   left: 0;
   display: none;
 }
+
 .mosaic-drop-target .drop-target-container.-dragging {
   display: block;
 }
+
 .mosaic-drop-target .drop-target-container .drop-target {
   position: absolute;
   top: 0;
@@ -124,30 +146,39 @@
   opacity: 0;
   z-index: 5;
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.left {
   right: calc(100% -  30% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.right {
   left: calc(100% -  30% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.bottom {
   top: calc(100% -  30% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.top {
   bottom: calc(100% -  30% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.drop-target-hover {
   opacity: 1;
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.drop-target-hover.left {
   right: calc(100% -  50% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.drop-target-hover.right {
   left: calc(100% -  50% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.drop-target-hover.bottom {
   top: calc(100% -  50% );
 }
+
 .mosaic-drop-target .drop-target-container .drop-target.drop-target-hover.top {
   bottom: calc(100% -  50% );
 }
@@ -160,6 +191,7 @@
   overflow: hidden;
   box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
 }
+
 .mosaic-window .mosaic-window-toolbar,
 .mosaic-preview .mosaic-window-toolbar {
   z-index: 4;
@@ -171,10 +203,12 @@
   background: white;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
 }
+
 .mosaic-window .mosaic-window-toolbar.draggable,
 .mosaic-preview .mosaic-window-toolbar.draggable {
   cursor: move;
 }
+
 .mosaic-window .mosaic-window-title,
 .mosaic-preview .mosaic-window-title {
   padding-left: 15px;
@@ -184,17 +218,20 @@
   overflow: hidden;
   min-height: 18px;
 }
+
 .mosaic-window .mosaic-window-controls,
 .mosaic-preview .mosaic-window-controls {
   display: flex;
   height: 100%;
 }
+
 .mosaic-window .mosaic-window-controls .separator,
 .mosaic-preview .mosaic-window-controls .separator {
   height: 20px;
   border-left: 1px solid black;
   margin: 5px 4px;
 }
+
 .mosaic-window .mosaic-window-body,
 .mosaic-preview .mosaic-window-body {
   position: relative;
@@ -204,6 +241,7 @@
   z-index: 1;
   overflow: hidden;
 }
+
 .mosaic-window .mosaic-window-additional-actions-bar,
 .mosaic-preview .mosaic-window-additional-actions-bar {
   position: absolute;
@@ -218,14 +256,17 @@
   display: flex;
   z-index: 3;
 }
+
 .mosaic-window .mosaic-window-additional-actions-bar .pt-button,
 .mosaic-preview .mosaic-window-additional-actions-bar .pt-button {
   margin: 0;
 }
-.mosaic-window .mosaic-window-additional-actions-bar .pt-button:after,
-.mosaic-preview .mosaic-window-additional-actions-bar .pt-button:after {
+
+.mosaic-window .mosaic-window-additional-actions-bar .pt-button::after,
+.mosaic-preview .mosaic-window-additional-actions-bar .pt-button::after {
   display: none;
 }
+
 .mosaic-window .mosaic-window-body-overlay,
 .mosaic-preview .mosaic-window-body-overlay {
   position: absolute;
@@ -238,14 +279,17 @@
   display: none;
   z-index: 2;
 }
+
 .mosaic-window.additional-controls-open .mosaic-window-additional-actions-bar,
 .mosaic-preview.additional-controls-open .mosaic-window-additional-actions-bar {
   height: 30px;
 }
+
 .mosaic-window.additional-controls-open .mosaic-window-body-overlay,
 .mosaic-preview.additional-controls-open .mosaic-window-body-overlay {
   display: block;
 }
+
 .mosaic-window .mosaic-preview,
 .mosaic-preview .mosaic-preview {
   height: 100%;
@@ -255,6 +299,7 @@
   border: 1px solid black;
   max-height: 400px;
 }
+
 .mosaic-window .mosaic-preview .mosaic-window-body,
 .mosaic-preview .mosaic-preview .mosaic-window-body {
   display: flex;
@@ -262,23 +307,29 @@
   align-items: center;
   justify-content: center;
 }
+
 .mosaic-window .mosaic-preview h4,
 .mosaic-preview .mosaic-preview h4 {
   margin-bottom: 10px;
 }
+
 .mosaic-window .mosaic-preview .pt-icon,
 .mosaic-preview .mosaic-preview .pt-icon {
   font-size: 72px;
 }
-.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-cross:before {
+
+.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-cross::before {
   content: 'Close';
 }
-.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-add-column-right:before {
+
+.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-add-column-right::before {
   content: 'Split';
 }
-.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-exchange:before {
+
+.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-exchange::before {
   content: 'Replace';
 }
-.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-maximize:before {
+
+.mosaic:not(.mosaic-blueprint-theme) .mosaic-default-control.pt-icon-maximize::before {
   content: 'Expand';
 }
diff --git a/src/less/mosaic.less b/src/less/mosaic.less
index c6483d0c01..ea42660e58 100644
--- a/src/less/mosaic.less
+++ b/src/less/mosaic.less
@@ -20,7 +20,7 @@
     width: 20px;
     margin: 5px;
     background-color: #314246;
-    border: .1rem solid #222b35;
+    border: 0.1rem solid #222b35;
   }
 
   button.mosaic-default-control:hover {
diff --git a/src/less/output.less b/src/less/output.less
index 5c54e691b6..a44d9e89cd 100644
--- a/src/less/output.less
+++ b/src/less/output.less
@@ -5,15 +5,15 @@
   font-family: @default-fonts;
   font-weight: 600;
   color: #f3f3f3;
-  background: rgba(0,0,0, .4);
+  background: rgba(0, 0, 0, 0.4);
   top: 10vh;
   padding: 0;
   padding-left: 10px;
   margin-top: 0;
   height: 0;
   overflow-y: scroll;
-  transition: height .2s;
-  transition: padding .2s;
+  transition: height 0.2s;
+  transition: padding 0.2s;
   -webkit-app-region: no-drag;
 
   &.showing {
diff --git a/src/less/resets.less b/src/less/resets.less
index aedcacbf2b..a83a6d3f1d 100644
--- a/src/less/resets.less
+++ b/src/less/resets.less
@@ -4,20 +4,32 @@ a {
   color: @electron-bright;
 }
 
-.button, button, input[type='button'], input[type='reset'], input[type='submit'] {
+.button,
+button,
+input[type='button'],
+input[type='reset'],
+input[type='submit'] {
   background-color: @electron-bright;
-  border: .1rem solid @electron-bright;
+  border: 0.1rem solid @electron-bright;
 }
 
-.button.button-outline, button.button-outline, input[type='button'].button-outline, input[type='reset'].button-outline, input[type='submit'].button-outline {
+.button.button-outline,
+button.button-outline,
+input[type='button'].button-outline,
+input[type='reset'].button-outline,
+input[type='submit'].button-outline,
+.button.button-clear,
+button.button-clear,
+input[type='button'].button-clear,
+input[type='reset'].button-clear,
+input[type='submit'].button-clear {
   color: @electron-bright;
 }
 
-.button.button-clear, button.button-clear, input[type='button'].button-clear, input[type='reset'].button-clear, input[type='submit'].button-clear {
-  color: @electron-bright;
-}
-
-.button[disabled]:focus, .button[disabled]:hover, button[disabled]:focus, button[disabled]:hover {
+.button[disabled]:focus,
+.button[disabled]:hover,
+button[disabled]:focus,
+button[disabled]:hover {
   border-color: @electron-tuned;
   background: unset;
   color: unset;
@@ -34,10 +46,10 @@ pre.prettyprint .lit {
 
 pre {
   background: #f4f5f6;
-  border-left: .3rem solid @electron-bright;
+  border-left: 0.3rem solid @electron-bright;
 
   &.prettyprint {
-    border-left: .3rem solid @electron-bright !important;
+    border-left: 0.3rem solid @electron-bright !important;
     color: #655d5d;
 
     .tag {
@@ -59,7 +71,7 @@ input[type='text']:focus,
 input[type='url']:focus,
 textarea:focus,
 select:focus {
-  border: .1rem solid @electron-bright;
+  border: 0.1rem solid @electron-bright;
 }
 
 select:focus {
diff --git a/src/less/root.less b/src/less/root.less
index 2cc52cfe93..a2af2d7594 100644
--- a/src/less/root.less
+++ b/src/less/root.less
@@ -3,6 +3,7 @@
 
 @import "resets.less";
 @import "main.less";
+@import "commands.less";
 @import "output.less";
 @import "dialogs.less";
 @import "mosaic-vendor.less";
diff --git a/src/less/settings.less b/src/less/settings.less
index 44328afc72..b75fe3ff8f 100644
--- a/src/less/settings.less
+++ b/src/less/settings.less
@@ -10,7 +10,11 @@
   user-select: none;
   cursor: initial;
 
-  h1, h2, h3, h4, h5 {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5 {
     color: white;
     cursor: initial;
   }
@@ -74,7 +78,7 @@
     .contributor {
       width: 320px;
       height: 120px;
-      background: rgba(255, 255, 255, .1);
+      background: rgba(255, 255, 255, 0.1);
       padding: 10px;
       margin: 0 10px 10px 0;
       display: flex;
@@ -82,10 +86,11 @@
       cursor: pointer;
 
       &:hover {
-        background: rgba(255, 255, 255, .15);
+        background: rgba(255, 255, 255, 0.15);
       }
 
-      h5, p {
+      h5,
+      p {
         margin-bottom: 0;
       }
 
@@ -117,7 +122,7 @@
     li {
       padding-bottom: 5px;
       border-bottom: solid 1px rgba(255, 255, 255, 0.2);
-      color: rgba(255, 255, 255, .8);
+      color: rgba(255, 255, 255, 0.8);
 
       &:hover {
         padding-bottom: 5px;
diff --git a/static/index.html b/static/index.html
index 2494ce1e94..fbb9c2191d 100644
--- a/static/index.html
+++ b/static/index.html
@@ -6,13 +6,7 @@
   <title>Electron Fiddle</title>
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="stylesheet" href="../node_modules/milligram/dist/milligram.min.css">
-  <link rel="stylesheet" href="./css/mosaic-vendor.css">
-  <link rel="stylesheet" href="./css/main.css">
-  <link rel="stylesheet" href="./css/colors.css">
-  <link rel="stylesheet" href="./css/commands.css">
-  <link rel="stylesheet" href="./css/mosaic.css">
-  <link rel="stylesheet" href="./css/dialogs.css">
-  <link rel="stylesheet" href="./css/settings.css">
+  <link rel="stylesheet" href="./css/root.css">
 </head>
 <body class="fiddle">
   <div id="app"></div>
diff --git a/tools/fetch-contributors.js b/tools/contributors.js
similarity index 98%
rename from tools/fetch-contributors.js
rename to tools/contributors.js
index 2e18cd83be..9bc8aa3531 100644
--- a/tools/fetch-contributors.js
+++ b/tools/contributors.js
@@ -140,3 +140,5 @@ async function fetchAndWriteContributorsFile() {
 module.exports = {
   maybeFetchContributors
 }
+
+if (require.main === module) maybeFetchContributors();
diff --git a/tools/generateAssets.js b/tools/generateAssets.js
index bd9e173dc0..21e3bb58cf 100644
--- a/tools/generateAssets.js
+++ b/tools/generateAssets.js
@@ -1,9 +1,11 @@
 /* tslint:disable */
 
-const { maybeFetchContributors } = require('./fetch-contributors');
-const { generateTypeScript } = require('./tsc');
+const { maybeFetchContributors } = require('./contributors');
+const { compileTypeScript } = require('./tsc');
+const { compileLess } = require('./lessc');
 
 module.exports = async () => {
   await maybeFetchContributors();
-  await generateTypeScript();
+  await compileTypeScript();
+  await compileLess();
 }
diff --git a/tools/lessc.js b/tools/lessc.js
new file mode 100644
index 0000000000..5dcec72c2b
--- /dev/null
+++ b/tools/lessc.js
@@ -0,0 +1,19 @@
+/* tslint:disable */
+
+const { run } = require('./run-bin');
+
+async function compileLess() {
+  const args = [
+    '--source-map-inline',
+    './src/less/root.less',
+    './static/css/root.css'
+  ];
+
+  await run('Less','lessc', args);
+};
+
+module.exports = {
+  compileLess
+}
+
+if (require.main === module) compileLess();
diff --git a/tools/run-bin.js b/tools/run-bin.js
new file mode 100644
index 0000000000..1ea9da4e8f
--- /dev/null
+++ b/tools/run-bin.js
@@ -0,0 +1,30 @@
+/* tslint:disable */
+
+const childProcess = require('child_process');
+const path = require('path');
+const logSymbols = require('log-symbols');
+
+async function run(name, bin, args = []) {
+  await new Promise((resolve, reject) => {
+    console.info(logSymbols.info, `Running ${name}`);
+
+    const cmd = process.platform === 'win32' ? `${bin}.cmd` : bin;
+    const child = childProcess.spawn(
+      path.resolve(__dirname, '..', 'node_modules', '.bin', cmd),
+      args,
+      {
+        cwd: path.resolve(__dirname, '..'),
+        stdio: 'inherit'
+      }
+    );
+
+    child.on('exit', (code) => {
+      if (code === 0) return resolve();
+      reject(new Error(`${name} failed`));
+    });
+  });
+};
+
+module.exports = {
+  run
+}
diff --git a/tools/tsc.js b/tools/tsc.js
index 536641fa1e..02529ffe34 100644
--- a/tools/tsc.js
+++ b/tools/tsc.js
@@ -1,30 +1,13 @@
 /* tslint:disable */
 
-const childProcess = require('child_process');
-const path = require('path');
-const logSymbols = require('log-symbols');
+const { run } = require('./run-bin');
 
-async function generateTypeScript() {
-  await new Promise((resolve, reject) => {
-    console.info(logSymbols.info, 'Compiling Typescript');
-
-    const cmd = process.platform === 'win32' ? 'tsc.cmd' : 'tsc';
-    const child = childProcess.spawn(
-      path.resolve(__dirname, '..', 'node_modules', '.bin', cmd),
-      ['-p', 'tsconfig.json'],
-      {
-        cwd: path.resolve(__dirname, '..'),
-        stdio: 'inherit'
-      }
-    );
-
-    child.on('exit', (code) => {
-      if (code === 0) return resolve();
-      reject(new Error('Typescript compilation failed'));
-    });
-  });
+async function compileTypeScript() {
+  await run('TypeScript', 'tsc', ['-p', 'tsconfig.json']);
 };
 
 module.exports = {
-  generateTypeScript
+  compileTypeScript
 }
+
+if (require.main === module) compileLess();