diff --git a/src/js/control-view.js b/src/js/control-view.js
index 3a65b11..082f88a 100644
--- a/src/js/control-view.js
+++ b/src/js/control-view.js
@@ -502,6 +502,19 @@ module.exports = {
 
         showProbeDialog: function(probeType) {
             SvelteComponents.showDialog("Probe", { probeType });
+        },
+        runMacros : function(id){
+            if( this.config.macros[id].gcode_file_name != this.state.selected || this.config.macros[id].gcode_file_time != this.state.selected_time ){
+                this.state.selected=this.config.macros[id].gcode_file_name;
+                this.state.selected_time=this.config.macros[id].gcode_file_time
+            }
+            try{
+                this.load();
+                console.log("Loaded file");
+                // this.start_pause();
+            }catch(error){
+                console.warn("Error running program: ",error);
+            }
         }
     },
 
diff --git a/src/js/macros.js b/src/js/macros.js
index dd6d23e..27862c6 100644
--- a/src/js/macros.js
+++ b/src/js/macros.js
@@ -87,10 +87,8 @@ module.exports = {
 
             this.config.macros[id].name=macrosName;
             this.config.macros[id].color=macrosColor;
-            this.config.macros[id].gcode=this.state.selected;
-            
-            console.log(this.state.selected_time);
-            console.log(typeof(this.state.selected_time));
+            this.config.macros[id].gcode_file_name=this.state.selected;
+            this.config.macros[id].gcode_file_time=this.state.selected_time;
 
             console.log(this.config.macros);
             try {
diff --git a/src/pug/templates/control-view.pug b/src/pug/templates/control-view.pug
index 0205659..0bc6952 100644
--- a/src/pug/templates/control-view.pug
+++ b/src/pug/templates/control-view.pug
@@ -209,17 +209,17 @@ script#control-view-template(type="text/x-template")
 
     .macros-div(class="present")
        button.macros-buttons(title="Click to run Macros 1", @click="runMacros(0)",
-            :disabled="!true",style="height:60px;width:100px;font-weight:normal;border-radius:15px;border:0;background-color:{{config.macros[0].color}}") {{config.macros[0].name}}
+            :disabled="!true",v-bind:style="background-color:{{config.macros[0].color}};color:#fff") {{config.macros[0].name}}
        button.macros-buttons(title="Click to run Macros 2", @click="runMacros(1)",
-            :disabled="!true",style="height:60px;width:100px;font-weight:normal;border-radius:15px;border:0") Macros 2
+            :disabled="!true",v-bind:style="background-color:{{config.macros[1].color}};color:#fff") {{config.macros[1].name}}
        button.macros-buttons(title="Click to run Macros 3", @click="runMacros(2)",
-            :disabled="!true",style="height:60px;width:100px;font-weight:normal;border-radius:15px;border:0") Macros 3
+            :disabled="!true",v-bind:style="background-color:{{config.macros[2].color}};color:#fff") {{config.macros[2].name}}
        button.macros-buttons(title="Click to run Macros 4", @click="runMacros(3)",
-            :disabled="!true",style="height:60px;width:100px;font-weight:normal;border-radius:15px;border:0") Macros 4
+            :disabled="!true",v-bind:style="background-color:{{config.macros[3].color}};color:#fff") {{config.macros[3].name}}
        button.macros-buttons(title="Click to run Macros 5", @click="runMacros(4)",
-            :disabled="!true",style="height:60px;width:100px;font-weight:normal;border-radius:15px;border:0") Macros 5
+            :disabled="!true",v-bind:style="background-color:{{config.macros[4].color}};color:#fff") {{config.macros[4].name}}
        button.macros-buttons(title="Click to run Macros 6", @click="runMacros(5)",
-            :disabled="!true",style="height:60px;width:100px;font-weight:normal;border-radius:15px;border:0") Macros 6
+            :disabled="!true",v-bind:style="background-color:{{config.macros[5].color}};color:#fff") {{config.macros[5].name}}
 
 
     .tabs
diff --git a/src/resources/config-template.json b/src/resources/config-template.json
index 79b6ff7..14b131b 100644
--- a/src/resources/config-template.json
+++ b/src/resources/config-template.json
@@ -591,32 +591,38 @@
       {
          "name":"Macros 1",
          "color": "",
-         "gcode": ""
+         "gcode_file_name": "",
+         "gcode_file_time": 0
       },
       {
          "name":"Macros 2",
          "color": "",
-         "gcode": ""
+         "gcode_file_name": "",
+         "gcode_file_time": 0
       },
       {
          "name":"Macros 3",
          "color": "",
-         "gcode": ""
+         "gcode_file_name": "",
+         "gcode_file_time": 0
       },
       {
          "name":"Macros 4",
          "color": "",
-         "gcode": ""
+         "gcode_file_name": "",
+         "gcode_file_time": 0
       },
       {
          "name":"Macros 5",
          "color": "",
-         "gcode": ""
+         "gcode_file_name": "",
+         "gcode_file_time": 0
       },
       {
          "name":"Macros 6",
          "color": "",
-         "gcode": ""
+         "gcode_file_name": "",
+         "gcode_file_time": 0
       }
     ],
     "template": {
@@ -626,11 +632,15 @@
       },
       "color": {
         "type": "text",
-        "default": "Default Color"
+        "default": "#efefef"
       },
-      "gcode": {
+      "gcode_file_name": {
         "type": "text",
         "default": "Default G-Code"
+      },
+      "gcode_file_time": {
+        "type": "int",
+        "default": 0
       }
     }
   },
diff --git a/src/stylus/style.styl b/src/stylus/style.styl
index 9256d75..40f382b 100644
--- a/src/stylus/style.styl
+++ b/src/stylus/style.styl
@@ -621,6 +621,13 @@ span.unit
     margin 10px
     margin-left 400px
 
+  .macros-buttons
+    height 60px
+    width 100px
+    font-weight normal
+    border radius 10px
+    border 0
+
   .macros
     width 90%