diff --git a/source/_lovelace/energy.markdown b/source/_lovelace/energy.markdown
index 4b91455242e..c56e844f3ab 100644
--- a/source/_lovelace/energy.markdown
+++ b/source/_lovelace/energy.markdown
@@ -9,7 +9,19 @@ This is a list of all the cards used in the energy dashboard, you can also place
 
 At the moment there are no configuration options available for these cards, you can configure them on the energy {% my config_energy title="energy configuration page" %}.
 
-They will always show the data of today when used outside the energy dashboard.
+## Energy Date Picker
+
+<p class='img'>
+  <img src='/images/lovelace/energy/date-selection.png' alt='Screenshot of the energy date selection card'>
+  Screenshot of the Energy date selection card.
+</p>
+
+This card will allow you to pick what data to show. Changing it in this card will influence the data in all other cards.
+
+#### Example
+```yaml
+type: energy-date-selection
+```
 
 ## Energy usage graph
 
@@ -124,4 +136,4 @@ The devices energy graph show the energy usage per device, it is sorted by usage
 #### Example
 ```yaml
 type: energy-devices-graph
-```
\ No newline at end of file
+```
diff --git a/source/images/lovelace/energy/date-selection.png b/source/images/lovelace/energy/date-selection.png
new file mode 100644
index 00000000000..710426e82bc
Binary files /dev/null and b/source/images/lovelace/energy/date-selection.png differ