diff --git a/productionboard/src/main/resources/static/js/common/synthetic.js b/productionboard/src/main/resources/static/js/common/synthetic.js
index 05b094d..b74a383 100644
--- a/productionboard/src/main/resources/static/js/common/synthetic.js
+++ b/productionboard/src/main/resources/static/js/common/synthetic.js
@@ -6,7 +6,7 @@ const dataInformationFunction = (statusArray) => {
                 <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
             </tr>
             <tr style="width: 100%; height: 50%;">
-                <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: white;">${statusArray[2]}kW·h</td>
+                <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: #59B2F6;">${statusArray[2]}kW·h</td>
                 <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
             </tr>
         </table>`;
diff --git a/productionboard/src/main/resources/static/js/tankShell/device.js b/productionboard/src/main/resources/static/js/tankShell/device.js
index 2e66106..9986c2a 100644
--- a/productionboard/src/main/resources/static/js/tankShell/device.js
+++ b/productionboard/src/main/resources/static/js/tankShell/device.js
@@ -90,7 +90,7 @@ const dataInformationFunction = (statusArray) => {
             </tr>
             <tr style="width: 100%; height: 50%;">
             
-                <td style="border:0px solid red;text-align:center;width: 50%;color: #CEEFFE;"> ${res.deviceEnergy}kW·h</td>
+                <td style="border:0px solid red;text-align:center;width: 50%;color: #59B2F6;"> ${res.deviceEnergy}kW·h</td>
                 <td style="border:0px solid red;text-align:center;width: 50%;color: red;">2</td>
             </tr>
         </table>`;
diff --git a/productionboard/target/classes/static/js/common/synthetic.js b/productionboard/target/classes/static/js/common/synthetic.js
index 05b094d..b74a383 100644
--- a/productionboard/target/classes/static/js/common/synthetic.js
+++ b/productionboard/target/classes/static/js/common/synthetic.js
@@ -6,7 +6,7 @@ const dataInformationFunction = (statusArray) => {
                 <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
             </tr>
             <tr style="width: 100%; height: 50%;">
-                <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: white;">${statusArray[2]}kW·h</td>
+                <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: #59B2F6;">${statusArray[2]}kW·h</td>
                 <td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
             </tr>
         </table>`;
diff --git a/productionboard/target/classes/static/js/tankShell/device.js b/productionboard/target/classes/static/js/tankShell/device.js
index 2e66106..9986c2a 100644
--- a/productionboard/target/classes/static/js/tankShell/device.js
+++ b/productionboard/target/classes/static/js/tankShell/device.js
@@ -90,7 +90,7 @@ const dataInformationFunction = (statusArray) => {
             </tr>
             <tr style="width: 100%; height: 50%;">
             
-                <td style="border:0px solid red;text-align:center;width: 50%;color: #CEEFFE;"> ${res.deviceEnergy}kW·h</td>
+                <td style="border:0px solid red;text-align:center;width: 50%;color: #59B2F6;"> ${res.deviceEnergy}kW·h</td>
                 <td style="border:0px solid red;text-align:center;width: 50%;color: red;">2</td>
             </tr>
         </table>`;