diff --git a/site/demo/demo.css b/site/demo/demo.css
index 68d17a0..dd2b886 100644
--- a/site/demo/demo.css
+++ b/site/demo/demo.css
@@ -104,7 +104,7 @@ label {
 }
 
 .torch-button {
-    padding: 10px 20px;
+    padding: 10px 15px;
     font-size: 16px;
     background-color: #007bff;
     color: #fff;
@@ -135,10 +135,22 @@ label {
     background-color: #821414;
 }
 
+#clear-button {
+    background-color: #818181;
+}
+
+#clear-button:hover {
+    background-color: #5f5f5f;
+}
+
+#clear-button:active {
+    background-color: #3a3a3a;
+}
+
 .device-button {
     width: 10%;
     background-color: #818181;
-    padding-right: 20px;
+    padding-right: 15px;
     padding-top: 10px;
     padding-bottom: 10px;
     font-size: 16px;
diff --git a/site/demo/index.html b/site/demo/index.html
index bd3afaa..d0225db 100644
--- a/site/demo/index.html
+++ b/site/demo/index.html
@@ -566,7 +566,7 @@ <h2 style="display: inline-block; margin-left: 20px; margin-top: 6.5px; margin-b
                       <div>
                           <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model Layers</h2>
                           <button class="torch-button" class='layer-button' onclick="addBox()">+</button>
-                          <button class="torch-button" class='layer-button' onclick="removeBox()">-</button>
+                          <button class="torch-button" class='layer-button' onclick="removeBox()" style="padding: 10px 17.3px;"> - </button>
                           <div class="separator" id="layersBox">
                               
                           </div>
@@ -575,6 +575,7 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
                           <button class="torch-button" id="start-button" onclick="trainLoopInitializer()">Train</button>
                           <button class="torch-button" id="stop-button" onclick="pauseTraining()">Pause</button>
                           <button class="torch-button" id="reset-button" onclick="resetTraining()">Reset</button>
+                          <button class="torch-button" id="clear-button" onclick="clearTraining()">Clear</button>
                           <div style="width: 25px; display: inline-block;"></div>
                           <button id="cpu-trigger" class="device-button" onclick="CPUCaller()">CPU</button>
                           <button id="gpu-trigger" class="device-button" onclick="GPUCaller()">GPU</button>
@@ -600,7 +601,7 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
               <script src="./gpu-browser.min.js"></script>
               <script>
                   let boxCount = [];
-                  let data = [];
+                  let data = [[-Math.log(0.1)]];
                   let training = false;
                   let in_loop = true;
                   let overFlow = 1;
@@ -807,10 +808,9 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
                           // If loss went to infinity (model way too large for training size), represent that in the graph:
                           if (isNaN(loss_test.data[0])) {
                               overFlow = overFlow * 1.5;
-                              data.push(overFlow + (Math.random() - 0.5) * 15);
+                              data[data.length - 1].push(overFlow + (Math.random() - 0.5) * 15);
                           // If not, just keep adding the loss to the graph:
-                          } else {data.push(loss_test.data)}
-          
+                          } else {data[data.length - 1].push(loss_test.data[0])}
                           // Display iteration and loss on the screen:
                           document.getElementById('iter').innerHTML = `<b>Iteration:</b> ${iter}`;
                           document.getElementById('total-visited').innerHTML = `<b>Total Training Examples:</b> ${total_visited}`;
@@ -854,7 +854,7 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
                       smoothAcc = 0.1;
                       iter = 0;
                       total_visited = 0;
-                      data = [];
+                      data.push([]);
                       plotGraph();
                       buttons = document.getElementsByClassName('layer-button');
                       for (button of buttons) {
@@ -866,6 +866,12 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
                           button.style.backgroundColor = '';
                       }
                   };
+
+                  function clearTraining() {
+                      resetTraining();
+                      data = [[-Math.log(0.1)]];
+                      plotGraph()
+                  };
           
                   function plotGraph() {
                       var canvas = document.getElementById('graph');
@@ -874,8 +880,17 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
           
                       var startX = 50;
                       var startY = canvas.height - 30;
-                      var maxX = data.length - 1;
-                      var maxY = Math.max(...data);
+                      maxLength = 0;
+                      maxY = 0;
+                      for (arr of data) {
+                        if (arr.length > maxLength) {
+                          maxLength = arr.length;
+                        }
+                        if (Math.max(...arr) > maxY) {
+                          maxY = Math.max(...arr);
+                        }
+                      }
+                      var maxX = maxLength - 1;
                       var stepX = (canvas.width - 2 * startX) / maxX;
                       var stepY = (startY - 30) / maxY;
           
@@ -943,17 +958,21 @@ <h2 style="display: inline-block; margin-right: 15px; margin-left: 20px;">Model
                           
                       };
           
+                      const colors = ['red', 'orange','gold','lime', 'green', 'blue', 'purple', 'black']
+
                       // Draw line plot
-                      ctx.beginPath();
-                      ctx.strokeStyle = 'blue';
-                      ctx.lineWidth = 2;
-                      ctx.moveTo(startX, startY - data[0] * stepY);
-                      for (var i = 1; i <= maxX; i++) {
-                          var x = startX + i * stepX;
-                          var y = startY - data[i] * stepY;
-                          ctx.lineTo(x, y);
-                      };
-                      ctx.stroke();
+                      for (let idx = 0; idx < data.length; idx += 1) {
+                        ctx.beginPath();
+                        ctx.strokeStyle = colors[idx];
+                        ctx.lineWidth = 2;
+                        ctx.moveTo(startX, startY - data[idx][0] * stepY);
+                        for (var i = 1; i <= maxX; i++) {
+                            var x = startX + i * stepX;
+                            var y = startY - data[idx][i] * stepY;
+                            ctx.lineTo(x, y);
+                        };
+                        ctx.stroke();
+                      }
                   };
           
                   // Initial setup