diff --git a/static/css/webvirtcloud.css b/static/css/webvirtcloud.css
index 6c2b8d1..7591863 100644
--- a/static/css/webvirtcloud.css
+++ b/static/css/webvirtcloud.css
@@ -145,4 +145,36 @@ p {
 
 .flot-chart {
     max-height: 250px;
+}
+
+.netIN {
+    border-color: rgb(83, 191, 189);
+    margin: 0.5em;
+    border-style: solid;
+    border-width: 0 0 0 1em;
+    padding: 0 0.3em;
+}
+
+.netOUT {
+    border-color: rgb(151, 187, 205);
+    margin: 0.5em;
+    border-style: solid;
+    border-width: 0 0 0 1em;
+    padding: 0 0.3em;
+}
+
+.diskRD {
+    border-color: rgb(190, 195, 205);
+    margin: 0.5em;
+    border-style: solid;
+    border-width: 0 0 0 1em;
+    padding: 0 0.3em;
+}
+
+.diskWR {
+    border-color: rgb(249, 134, 33);
+    margin: 0.5em;
+    border-style: solid;
+    border-width: 0 0 0 1em;
+    padding: 0 0.3em;
 }
\ No newline at end of file
diff --git a/templates/instance.html b/templates/instance.html
index 4763878..e5f800c 100644
--- a/templates/instance.html
+++ b/templates/instance.html
@@ -718,6 +718,8 @@
                                                             <div class="flot-chart">
                                                                 <div class="flot-chart-content" id="flot-moving-line-chart" style="padding: 0px; position: relative;">
                                                                     <canvas id="netEth{{ forloop.counter0 }}Chart" width="735" height="250"></canvas>
+                                                                    <span class="netIN">{% trans "In" %}</span>
+                                                                    <span class="netOUT">{% trans "Out" %}</span>
                                                                 </div>
                                                             </div>
                                                         </div>
@@ -732,6 +734,8 @@
                                                             <div class="flot-chart">
                                                                 <div class="flot-chart-content" id="flot-moving-line-chart" style="padding: 0px; position: relative;">
                                                                     <canvas id="blk{{ disk.dev }}Chart" width="735" height="250"></canvas>
+                                                                    <span class="diskRD">{% trans "Read" %}</span>
+                                                                    <span class="diskWR">{% trans "Write" %}</span>
                                                                 </div>
                                                             </div>
                                                         </div>
@@ -890,9 +894,9 @@
             labels : [0, 0, 0, 0, 0],
             datasets : [
                 {
-                    "fillColor": "rgba(83,191,189,0.5)",
-                    "strokeColor": "rgba(83,191,189,1)",
-                    "pointColor": "rgba(83,191,189,1)",
+                    "fillColor": "rgba(220,220,220,0.5)",
+                    "strokeColor": "rgba(220,220,220,1)",
+                    "pointColor": "rgba(220,220,220,1)",
                     "pointStrokeColor": "#fff",
                     "data": [0, 0, 0, 0, 0]
                 },
@@ -904,7 +908,7 @@
                     "data": [0, 0, 0, 0, 0]
                 },
             ]
-        }
+        };
 
         var netLineData = {
             labels : [0, 0, 0, 0, 0],
@@ -924,7 +928,7 @@
                     "data": [0, 0, 0, 0, 0]
                },
             ]
-        }
+        };
 
         var cpuOpt = {
             animation: false,