Skip to content

Electricity Cards (Big!)

Series 2 will be released in 2025!

Visualization

These big cards show electricity sensors using sparkline graphs.

These are really big cards, but do show lots of the possibilities of the Swiss Army Knife Card and the sparkline tool.

These are really advanced cards (lots of YAML...)

  • Electricity Card "#3"

    I have no solar panels, so the blue part of the flower is fake!

    Electricity #3 Example - Light Electricity #3 Example - Dark

    Electricity #3 Example

  • Electricity Card "#4"

    I have no solar panels, so the blue part of the flower is fake!

    The power sensor just changed when I took the screenshot (dark mode only)

    so you see the left graph having animated bars, and in the block below you see 0,137kW while the graph is still showing the previous data (red, so > 2kW).

    Electricity #4 Example - Light Electricity #4 Example - Dark

    Electricity #4 Example

  • Electricity Card "#5"

    I have no solar panels, so the blue part of the flower is fake!

    Electricity #5 Example - Light Electricity #5 Example - Dark

    Electricity #5 Example

Description Aspect Ratio Target Size
A cards show Awair sensor data in different ways. 1/1 Grid with 2 columns

Interaction

Part Description
Card All tools connected to an entity do show by default the "more-info" dialog once clicked

Electricity Card #3 Example

4.0.1

The card shows a comprehensive overview of the electricity usage and return:

  1. Today's Electricity Header: Displays the average, minimum, and maximum electricity used over the last 24 hours.

  2. Mid Section:

    • Left Graph: Electricity used from the grid.
    • Right Graph: Electricity returned to the grid.
    • Flower Diagram:
      • In Center Circle: Actual usage and delivered power.
      • Inner Circle (Blue): Today's history of electricity delivered to the grid.
      • Outer Circle (Green/Orange/Yellow/Red): Today's history of electricity used from the grid.

  3. Per Phase Usage: Shows the current power used/returned from the grid for each of the three phases (230V/25A each).

  4. Totals:

    • From the Grid: Current and Total electricity used (day/month/year) from the grid.
    • To the Grid: Current and Total electricity delivered (day/month/year) to the grid.

Electricity #3 Example - Dark Electricity #3 Example - Light

Usage

Replace example entities with your entities!

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
- type: 'custom:swiss-army-knife-card'
  entities:
    ## Today actual power
    # 0..3
    - entity: sensor.dsmr_reading_electricity_currently_delivered
      name: 'Total'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l1
      name: 'L1'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l2
      name: 'L2'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l3
      name: 'L3'
    ## Returned actual power
    # 4..6
    - entity: sensor.dsmr_reading_electricity_currently_returned
      name: 'Total'
    - entity: sensor.dsmr_reading_phase_currently_returned_l1
      name: 'L1'
    - entity: sensor.dsmr_reading_phase_currently_returned_l2
      name: 'L2'
    - entity: sensor.dsmr_reading_phase_currently_returned_l3
      name: 'L3'

    ## Today actual energy
    # 7..9
    - entity: sensor.dsmr_day_consumption_electricity_merged
      name: 'Today'
      decimals: 2
    - entity: sensor.dsmr_current_month_electricity_merged
      name: 'This Month'
      decimals: 1
    - entity: sensor.dsmr_current_year_electricity_merged
      name: 'This Year'
      decimals: 0
    ## Returned stuff
    # 10..12
    - entity: sensor.dsmr_day_consumption_electricity_returned_merged
      name: 'Today'
      decimals: 2
    - entity: sensor.dsmr_current_month_electricity_returned_merged
      name: 'This Month'
      decimals: 1
    - entity: sensor.dsmr_current_year_electricity_returned_merged
      name: 'This Year'
      decimals: 0
  layout:
    template:
      name: sak_layout_fce2_electricity3

Electricity Card #4 Example

4.0.1

The card shows a comprehensive overview of the electricity usage and return:

  1. Flower Power Header: Displays the average, minimum, and maximum electricity used over the last 24 hours.

  2. Mid Section:

    • Left Graph: Electricity used from the grid.
    • Right Graph: Electricity returned to the grid.
    • Flower Diagram:
      • In Center Circle: Actual usage and delivered power.
      • Outer Circle (Blue): Today's history of electricity delivered to the grid.
      • Inner Circle (Green/Orange/Yellow/Red): Today's history of electricity used from the grid.

  3. Per Phase Usage: Shows the current power used/returned from the grid for each of the three phases (230V/25A each).

  4. Totals:

    • Today (Vandaag): Total electricity used from the grid (left/green) and delivered to the grid (right/blue).
    • This Month (Deze Maand): Total electricity used from the grid (left/green) and delivered to the grid (right/blue).
    • This Year (Dit Jaar): Total electricity used from the grid (left/green) and delivered to the grid (right/blue).

Blue/green gradients are used for both the backgrounds and the bounding boxes.

Electricity #4 Example - Dark Electricity #4 Example - Light

Usage

Replace example entities with your entities!

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
- type: 'custom:swiss-army-knife-card'
  entities:
    ## Today actual power
    # 0..3
    - entity: sensor.dsmr_reading_electricity_currently_delivered
      name: 'Total'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l1
      name: 'L1'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l2
      name: 'L2'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l3
      name: 'L3'
    ## Returned actual power
    # 4..6
    - entity: sensor.dsmr_reading_electricity_currently_returned
      name: 'Total'
    - entity: sensor.dsmr_reading_phase_currently_returned_l1
      name: 'L1'
    - entity: sensor.dsmr_reading_phase_currently_returned_l2
      name: 'L2'
    - entity: sensor.dsmr_reading_phase_currently_returned_l3
      name: 'L3'

    ## Today actual energy
    # 7..9
    - entity: sensor.dsmr_day_consumption_electricity_merged
      name: 'Vandaag' #'Today'
      decimals: 2
    - entity: sensor.dsmr_current_month_electricity_merged
      name: 'Deze Maand' #'This Month'
      decimals: 1
    - entity: sensor.dsmr_current_year_electricity_merged
      name: 'Dit Jaar' #'This Year'
      decimals: 0
    ## Returned stuff
    # 10..12
    - entity: sensor.dsmr_day_consumption_electricity_returned_merged
      name: 'Today'
      decimals: 2
    - entity: sensor.dsmr_current_month_electricity_returned_merged
      name: 'This Month'
      decimals: 1
    - entity: sensor.dsmr_current_year_electricity_returned_merged
      name: 'This Year'
      decimals: 0
  layout:
    template:
      name: sak_layout_fce2_electricity4

Electricity Card #5 Example

4.0.1

The card shows a comprehensive overview of the electricity usage and return:

  1. Flower Power Header: Displays the average, minimum, and maximum electricity used over the last 24 hours.

  2. Mid Section:

    • Flower Diagram:
      • In Center Circle: Total usage and delivered power for today.
      • Outer Circle (Blue): Today's history of electricity delivered to the grid.
      • Inner Circle (Green/Orange/Yellow/Red): Today's history of electricity used from the grid.
    • This Month (Deze Maand): Total electricity used from the grid (left/green) and delivered to the grid (right/blue).
    • This Year (Dit Jaar): Total electricity used from the grid (left/green) and delivered to the grid (right/blue).

  3. Current Power Usage (Huidig Vermogensgebruik): Shows the current power used/returned from the grid for each of the three phases (230V/25A each).

Blue/green gradients are used for both the backgrounds and the bounding boxes.

Electricity #5 Example - Dark Electricity #5 Example - Light

Usage

Replace example entities with your entities!

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
- type: 'custom:swiss-army-knife-card'
  entities:
    ## Today actual power
    # 0..3
    - entity: sensor.dsmr_reading_electricity_currently_delivered
      # name: 'Total'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l1
      name: 'L1'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l2
      name: 'L2'
    - entity: sensor.dsmr_reading_phase_currently_delivered_l3
      name: 'L3'
    ## Returned actual power
    # 4..6
    - entity: sensor.dsmr_reading_electricity_currently_returned
      name: 'Total'
    - entity: sensor.dsmr_reading_phase_currently_returned_l1
      name: 'L1'
    - entity: sensor.dsmr_reading_phase_currently_returned_l2
      name: 'L2'
    - entity: sensor.dsmr_reading_phase_currently_returned_l3
      name: 'L3'

    ## Today actual energy
    # 7..9
    - entity: sensor.dsmr_day_consumption_electricity_merged
      name: 'Vandaag' #'Today'
      decimals: 2
    - entity: sensor.dsmr_current_month_electricity_merged
      name: 'Deze Maand' #'This Month'
      decimals: 1
    - entity: sensor.dsmr_current_year_electricity_merged
      name: 'Dit Jaar' #'This Year'
      decimals: 0
    ## Returned stuff
    # 10..12
    - entity: sensor.dsmr_day_consumption_electricity_returned_merged
      name: 'Vandaag' #'Today'
      decimals: 2
    - entity: sensor.dsmr_current_month_electricity_returned_merged
      name: 'Deze Maand' #'This Month'
      decimals: 1
    - entity: sensor.dsmr_current_year_electricity_returned_merged
      name: 'Dit Jaar' #'This Year'
      decimals: 0
  layout:
    template:
      name: sak_layout_fce2_electricity5

Sensor Card #4 YAML Template Definition

4.0.1

Full definition of layout template 
1