diff --git a/web/public/js/components/server/metric-charts.js b/web/public/js/components/server/metric-charts.js
index b2ab6f69..a822dfe3 100644
--- a/web/public/js/components/server/metric-charts.js
+++ b/web/public/js/components/server/metric-charts.js
@@ -185,7 +185,7 @@ Vue.component("metric-chart", {
 							return v / axis.divider
 						}),
 						itemStyle: {
-							color: "#9DD3E8"
+							color: teaweb.DefaultChartColor
 						},
 						areaStyle: {},
 						barWidth: "20em"
@@ -257,7 +257,7 @@ Vue.component("metric-chart", {
 							return v / axis.divider
 						}),
 						itemStyle: {
-							color: "#9DD3E8"
+							color: teaweb.DefaultChartColor
 						},
 						areaStyle: {}
 					}
@@ -343,7 +343,7 @@ Vue.component("metric-chart", {
 							return v / axis.divider
 						}),
 						itemStyle: {
-							color: "#9DD3E8"
+							color: teaweb.DefaultChartColor
 						},
 						areaStyle: {},
 						barWidth: "20em"
diff --git a/web/public/js/utils.js b/web/public/js/utils.js
index f08ea6f8..d8110969 100644
--- a/web/public/js/utils.js
+++ b/web/public/js/utils.js
@@ -533,7 +533,7 @@ window.teaweb = {
 					type: "bar",
 					data: values.map(valueFunc),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: this.DefaultChartColor
 					},
 					barWidth: "20em"
 				}
@@ -598,7 +598,7 @@ window.teaweb = {
 					type: "line",
 					data: values.map(valueFunc),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: this.DefaultChartColor
 					},
 					areaStyle: {},
 					smooth: true
@@ -909,8 +909,9 @@ window.teaweb = {
 		return s
 	},
 	chartColor: function (color) {
+		// old blue: #5470c6
 		if (color == null || color.length == 0) {
-			color = "#5470c6"
+			color = "#9DD3E8"
 		}
 
 		if (color == "red") {
@@ -920,13 +921,14 @@ window.teaweb = {
 			color = "#fac858"
 		}
 		if (color == "blue") {
-			color = "#5470c6"
+			color = "#9DD3E8"
 		}
 		if (color == "green") {
 			color = "#3ba272"
 		}
 		return color
-	}
+	},
+	DefaultChartColor: "#9DD3E8"
 }
 
 String.prototype.quoteIP = function () {
diff --git a/web/views/@default/dashboard/index.js b/web/views/@default/dashboard/index.js
index acb105d2..57a060bf 100644
--- a/web/views/@default/dashboard/index.js
+++ b/web/views/@default/dashboard/index.js
@@ -104,13 +104,13 @@ Tea.context(function () {
 						return v.bytes / axis.divider;
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					lineStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
diff --git a/web/views/@default/servers/server/stat/clients.js b/web/views/@default/servers/server/stat/clients.js
index 4575ded7..bb92c520 100644
--- a/web/views/@default/servers/server/stat/clients.js
+++ b/web/views/@default/servers/server/stat/clients.js
@@ -60,7 +60,7 @@ Tea.context(function () {
 						return v.count / axis.divider;
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					barWidth: "20em"
 				}
diff --git a/web/views/@default/servers/server/stat/dailyRequests.js b/web/views/@default/servers/server/stat/dailyRequests.js
index 71675363..2b6e17ae 100644
--- a/web/views/@default/servers/server/stat/dailyRequests.js
+++ b/web/views/@default/servers/server/stat/dailyRequests.js
@@ -73,10 +73,10 @@ Tea.context(function () {
 						return v.countRequests / axis.divider
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
@@ -147,10 +147,10 @@ Tea.context(function () {
 						return v.bytes / axis.divider
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
diff --git a/web/views/@default/servers/server/stat/hourlyRequests.js b/web/views/@default/servers/server/stat/hourlyRequests.js
index ca59fa3b..a95ba6d5 100644
--- a/web/views/@default/servers/server/stat/hourlyRequests.js
+++ b/web/views/@default/servers/server/stat/hourlyRequests.js
@@ -73,10 +73,10 @@ Tea.context(function () {
 						return v.countRequests / axis.divider
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
@@ -147,10 +147,10 @@ Tea.context(function () {
 						return v.bytes / axis.divider
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
diff --git a/web/views/@default/servers/server/stat/index.js b/web/views/@default/servers/server/stat/index.js
index e8c51760..a37b39e2 100644
--- a/web/views/@default/servers/server/stat/index.js
+++ b/web/views/@default/servers/server/stat/index.js
@@ -82,10 +82,10 @@ Tea.context(function () {
 						return v.countRequests / axis.divider
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
@@ -156,10 +156,10 @@ Tea.context(function () {
 						return v.bytes / axis.divider
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					areaStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
diff --git a/web/views/@default/servers/server/stat/providers.js b/web/views/@default/servers/server/stat/providers.js
index afbf1e28..6ccc6d2e 100644
--- a/web/views/@default/servers/server/stat/providers.js
+++ b/web/views/@default/servers/server/stat/providers.js
@@ -51,7 +51,7 @@ Tea.context(function () {
 						return v.count / axis.divider;
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					barWidth: "20em"
 				}
diff --git a/web/views/@default/servers/server/stat/regions.js b/web/views/@default/servers/server/stat/regions.js
index cc9735be..cc4112eb 100644
--- a/web/views/@default/servers/server/stat/regions.js
+++ b/web/views/@default/servers/server/stat/regions.js
@@ -72,7 +72,7 @@ Tea.context(function () {
 						return v.count / axis.divider;
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					barWidth: "20em"
 				}
diff --git a/web/views/@default/servers/server/stat/waf.js b/web/views/@default/servers/server/stat/waf.js
index bfeb1caf..ecd72bc7 100644
--- a/web/views/@default/servers/server/stat/waf.js
+++ b/web/views/@default/servers/server/stat/waf.js
@@ -79,7 +79,7 @@ Tea.context(function () {
 					}),
 					areaStyle: {},
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					smooth: true
 				},
@@ -159,7 +159,7 @@ Tea.context(function () {
 						return v.count / axis.divider;
 					}),
 					itemStyle: {
-						color: "#9DD3E8"
+						color: teaweb.DefaultChartColor
 					},
 					barWidth: "20em"
 				}