diff --git a/src/components/chart/statistics-chart.ts b/src/components/chart/statistics-chart.ts
index b1f3be804d..d0c9265441 100644
--- a/src/components/chart/statistics-chart.ts
+++ b/src/components/chart/statistics-chart.ts
@@ -61,6 +61,8 @@ class StatisticsChart extends LitElement {
 
   @property() public chartType: ChartType = "line";
 
+  @property({ type: Boolean }) public hideLegend = false;
+
   @property({ type: Boolean }) public isLoadingData = false;
 
   @state() private _chartData: ChartData = { datasets: [] };
@@ -175,7 +177,7 @@ class StatisticsChart extends LitElement {
           propagate: true,
         },
         legend: {
-          display: true,
+          display: !this.hideLegend,
           labels: {
             usePointStyle: true,
           },
@@ -339,7 +341,7 @@ class StatisticsChart extends LitElement {
                 ? "-1"
                 : false
               : false,
-            borderColor: band ? color + "7F" : color,
+            borderColor: band ? color + (this.hideLegend ? "00" : "7F") : color,
             backgroundColor: band ? color + "3F" : color + "7F",
             pointRadius: 0,
             data: [],
diff --git a/src/dialogs/more-info/ha-more-info-history.ts b/src/dialogs/more-info/ha-more-info-history.ts
index 0177ca9eb9..bd6c3236db 100644
--- a/src/dialogs/more-info/ha-more-info-history.ts
+++ b/src/dialogs/more-info/ha-more-info-history.ts
@@ -65,6 +65,7 @@ export class MoreInfoHistory extends LitElement {
                 .statisticsData=${this._statistics}
                 .statTypes=${statTypes}
                 .names=${this._statNames}
+                hideLegend
               ></statistics-chart>`
             : html`<state-history-charts
                 up-to-now