UPS System Monitoring Card

Share your Projects! Dashboards & Frontend
12

Thanks for the card. I have updated the example to suite my CyberPower UPS running on Nut.

Screenshot 2022-07-23 154341
Screenshot 2022-07-23 154341753×587 43.2 KB 

id: server_ups
type: custom:config-template-card
variables:
  - states['sensor.server_ups_status'].state
  - states['sensor.server_ups_battery_charge'].state
  - states['sensor.server_ups_load'].state
  - states['sensor.server_ups_input_voltage'].state
  - states['sensor.server_ups_battery_voltage'].state
  - states['sensor.server_ups_battery_runtime'].state
entities:
  - sensor.server_ups_status
  - sensor.server_ups_battery_charge
  - sensor.server_ups_load
  - sensor.server_ups_input_voltage
  - sensor.server_ups_battery_voltage
  - sensor.server_ups_battery_runtime
card:
  type: entities
  show_header_toggle: 'off'
  style: |
    .card-header {
      padding: 0px 0px 0px 0px !important;
    }
  entities:
    - type: section
      card_mod:
        style: |
          .label {
            text-align: center !important;
            margin-left: 0px !important;
            font-size: 17px !important;
          }
          .divider {
              height: 0px !important;
          }
      label: ${ 'Server UPS - ' + vars[0] }
    - type: custom:hui-element
      card_type: vertical-stack
      cards:
        - type: horizontal-stack
          cards:
            - type: picture
              style: |
                ha-card { 
                    --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                    --ha-card-background: "rgba(0, 0, 0, 0.0)";
                    --ha-card-box-shadow: 'none';
                    width: 60% !important;
                }
              image: /local/Pictures/Cyberpower-mini.png
            - type: custom:button-card
              layout: icon_name_state2nd
              show_icon: true
              show_label: true
              styles:
                grid: null
                card:
                  - '--ha-card-background': rgba(0, 0, 0, 0.0)
                  - '--ha-card-box-shadow': none
                icon:
                  - padding: 10px 0px 0px
                  - height: 40px
                  - width: 40px
                label:
                  - padding: 10px 0px 0px
                  - justify-self: start
                  - font-family: Roboto, sans-serif
                  - font-size: 16px
                name:
                  - padding: 20px 0px 0px
                  - justify-self: start
              label: ${ (Number(vars[5])/60).toFixed(1) + ' Minutes' }
              name: 'Remaining:'
              tap_action:
                action: none
              hold_action:
                action: none
              double_tap_action:
                action: none
              icon: mdi:clock
        - type: horizontal-stack
          cards:
            - type: custom:bar-card
              show_icon: true
              align: split
              columns: 1
              max: 100
              positions:
                icon: inside
                indicator: inside
                name: inside
                value: inside
              unit_of_measurement: '%'
              severity:
                - value: 50
                  color: '#3498db'
                - value: 75
                  color: '#f39c12'
                - value: 100
                  color: '#e45e65'
              style: |
                ha-card { 
                  --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                  --ha-card-background: "rgba(0, 0, 0, 0.0)";
                  --paper-item-icon-color: 'var(--text-primary-color)';
                  --ha-card-box-shadow: 'none';
                }
                bar-card-name {
                  margin-left: -10px;
                }
              entity: sensor.server_ups_battery_charge
              name: Battery
              icon: mdi:battery-high
              entity_row: true
              tap_action:
                action: none
              hold_action:
                action: none
              double_tap_action:
                action: none
            - type: custom:bar-card
              show_icon: true
              align: split
              columns: 1
              max: 100
              positions:
                icon: inside
                indicator: inside
                name: inside
                value: inside
              unit_of_measurement: '%'
              severity:
                - value: 50
                  color: '#3498db'
                - value: 75
                  color: '#f39c12'
                - value: 100
                  color: '#e45e65'
              style: |
                ha-card { 
                  --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                  --ha-card-background: "rgba(0, 0, 0, 0.0)";
                  --paper-item-icon-color: 'var(--text-primary-color)';
                  --ha-card-box-shadow: 'none';
                }
                bar-card-name {
                  margin-left: -10px;
                }
              entity: sensor.server_ups_load
              tap_action:
                action: none
              hold_action:
                action: none
              double_tap_action:
                action: none
              name: ${ 'Load' }
              entity_row: true
        - type: entities
          entities:
            - entity: sensor.server_ups_input_voltage
              name: Input Voltage
              icon: mdi:power-plug
              tap_action:
                action: none
              hold_action:
                action: none
              double_tap_action:
                action: none
            - entity: sensor.server_ups_output_voltage
              name: Output Voltage
              icon: mdi:current-ac
              tap_action:
                action: none
              hold_action:
                action: none
              double_tap_action:
                action: none
          style: |
            ha-card { 
                --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                --ha-card-background: "rgba(0, 0, 0, 0.0)";
                --paper-item-icon-color: 'var(--text-primary-color)';
                --ha-card-box-shadow: 'none';
            }
1 Like
13

Just “name: Load”

Guys, you keep using this code w/o bothering to fix it…

The code is, let’s say, not optimal:

  1. You are using only ONE var for a label - no need to declare other FOUR vars.
  2. Moreover - there is no need to place the WHOLE card into config-template-card - place only ONE row with a label.
14

@Ildar_Gabdullin Thank you for the feedback. I will fix up the code.

15

Also, this code is USELESS:

  style: |
    .card-header {
      padding: 0px 0px 0px 0px !important;
    }

since the card does not have a header.

Probably, someone took a whole code from a place where this code has a meaning.
Then this code was truncated, became full of some useless stuff and then started been using by other people…

Use a “row” option instead of “card” for the “section” element only.
Or just use a markdown card instead of config-template-card.

There is no need to wrap custom:button-card into custom:config-template-card !!!
The button-card does support templates as you know.
Probably you need to look at the decluttering-card if you want to write a code abstract to a particular sensor’s name.

16

Guys this card was originally written by someone else a long time ago for earlier versions of home assistant and was quickly modified to make it functional only. In no way have I ever said the code for this card is optimal but it works so it’s been left as is. To be honest all my home assistant could prob do with code rewrites but I haven’t the time to spend “fixing” something that already just works so that is why it is how it is. If someone here has the time to rewrite it to optimise it and make it current please go ahead and do so and I’ll update the op, it would be greatly appreciated I just don’t have the time to do it myself and I’ll only look at it if a home assistant update breaks it…

17

OK, I will try to rewrite it then.
It will be just a “skeleton” code so it could be upgraded if required.

Here is my test example.
I took as an initial example a card which contains a graph.
The result card looks a bit differently than cards described above - but this may be tuned up by card-mod (colors, text-align, font-size, paddings. border-radius etc). The main point is a general idea - how to compose a card, additional styling is a secondary point.

Imho the most proper way is - place all cards in a stack w/o using hacks like “hui-element” card:

type: custom:stack-in-card
keep:
  outer_padding: true
cards:
  - type: markdown
    content: |
      APC --- {{states('sensor.ups_model')}} --- {{states('sensor.ups_status')}}
    card_mod:
      style: |
        ha-card {
          color: var(--mdc-theme-primary);
        }
  - type: horizontal-stack
    cards:
      - type: picture
        image: /local/images/devices/ups_sua1500i.png
      - type: custom:button-card
        entity: sensor.ups_time_left
        name: 'Remaining:'
        icon: mdi:battery-high
        layout: icon_name_state2nd
        show_icon: true
        show_state: true
  - type: custom:bar-card
    columns: 2
    entity_row: true
    positions:
      icon: inside
      indicator: 'off'
      name: inside
      value: inside
    entities:
      - entity: sensor.ups_battery
        name: Battery
        icon: mdi:battery-high
        unit_of_measurement: '%'
        severity:
          - from: 0
            to: 33
            color: red
          - from: 34
            to: 66
            color: orange
          - from: 67
            to: 100
            color: green
      - entity: sensor.ups_load
        name: Load
        icon: mdi:gauge
        unit_of_measurement: '%'
        severity:
          - from: 0
            to: 33
            color: green
          - from: 34
            to: 66
            color: orange
          - from: 67
            to: 100
            color: red
    card_mod:
      style: |
        ha-card { 
          --paper-item-icon-color: var(--primary-text-color);
        }
  - type: entities
    entities:
      - entity: sensor.ups_input_voltage
        name: Input Voltage
        icon: mdi:power-plug
      - entity: sensor.ups_battery_voltage
        name: Battery Voltage
        icon: mdi:battery-charging-high
      - type: section
  - type: custom:mini-graph-card
    entities:
      - entity: sensor.ups_input_voltage
    name: Input Voltage last 7 days
    hours_to_show: 0.15
    points_per_hour: 240
    aggregate_func: last
    smoothing: false
    line_width: 1
    lower_bound: ~0
    show:
      extrema: true
      labels: true
      fill: fade
      points: false
      icon: true
      state: false

Here there is no “config-template-card” since the “markdown” card (the only one which is supposed to show states as text labels) supports templates. Also, the “button-card” used for “remaining time” may be also used with a template.
For the graph - use your own “hours_to_show” & “points_per_hour”. Also, you may want to remove “lower_bound” if you are interested to see small deviations.
Icons & UoMs may be parts of sensors - so probably there is no need to specify them in the code (as long as you do not convert values to smth else).

image
image494×709 63.7 KB

Alternatively (especially if you dislike “stack-in-card”) - place everything inside Entities card and use “custom:hui-element” for the “markdown” & “horizontal-stack” cards.
Here the “Input Voltage” & “Battery Voltage” are placed into the “internal” Entities card (which gives additional paddings; the card is inserted by using “custom:hui-element”); alternatively they may be placed in the same Entities card - then those paddings may be added by card-mod.

type: entities
card_mod:
  style: |
    ha-card {
      --ha-card-box-shadow: none;
    }
entities:
  - type: custom:hui-element
    card_type: markdown
    content: |
      APC --- {{states('sensor.ups_model')}} --- {{states('sensor.ups_status')}}
    card_mod:
      style: |
        ha-card {
          color: var(--mdc-theme-primary);
        }
  - type: custom:hui-element
    card_type: horizontal-stack
    cards:
      - type: picture
        image: /local/images/devices/ups_sua1500i.png
      - type: custom:button-card
        entity: sensor.ups_time_left
        name: 'Remaining:'
        icon: mdi:battery-high
        layout: icon_name_state2nd
        show_icon: true
        show_state: true
  - type: custom:bar-card
    columns: 2
    entity_row: true
    positions:
      icon: inside
      indicator: 'off'
      name: inside
      value: inside
    entities:
      - entity: sensor.ups_battery
        name: Battery
        icon: mdi:battery-high
        unit_of_measurement: '%'
        severity:
          - from: 0
            to: 33
            color: red
          - from: 34
            to: 66
            color: orange
          - from: 67
            to: 100
            color: green
      - entity: sensor.ups_load
        name: Load
        icon: mdi:gauge
        unit_of_measurement: '%'
        severity:
          - from: 0
            to: 33
            color: green
          - from: 34
            to: 66
            color: orange
          - from: 67
            to: 100
            color: red
    card_mod:
      style: |
        ha-card { 
          --paper-item-icon-color: var(--primary-text-color);
        }
  - type: custom:hui-element
    card_type: entities
    entities:
      - entity: sensor.ups_input_voltage
        name: Input Voltage
        icon: mdi:power-plug
      - entity: sensor.ups_battery_voltage
        name: Battery Voltage
        icon: mdi:battery-charging-high
  - type: section
  - type: custom:mini-graph-card
    entities:
      - entity: sensor.ups_input_voltage
    name: Input Voltage last 7 days
    hours_to_show: 0.15
    points_per_hour: 240
    aggregate_func: last
    smoothing: false
    line_width: 1
    lower_bound: ~0
    show:
      extrema: true
      labels: true
      fill: fade
      points: false
      icon: true
      state: false

The card has a bit different view because paddings are different. This may be tuned up by card-mod.

image
image504×747 64.2 KB

P.S. Do not have a card for UPS in my HA setup since my SMT1500i, SMT750i cannot be integrated with HA. So, cannot share my own experience.
P.P.S. Found a typo in my test code - it should be “SMT1500i” instead of “SUA1500i”, these are different models (btw, SUA may be integrated with HA).

3 Likes
18

Hi @Ildar_Gabdullin I am trying to use this card. I have managed to set up NUT addon and integration for APC UPS Pro 900 since APC integration was not working (APC is connected with usb directly to NUC) but this integration does not have sensor.ups_time_left sensor. Is there a way how to set it up?

19

Hi, cannot help you, sorry.
I only proposed a card with assumption that these sensors are available.
I myself do not have UPS integrated since my SMT1500i & SMT750i do not seem to be supported ((((.

1 Like
20

My simple UPS monitoring card
image

Requires:

type: custom:stack-in-card
title: ''
mode: vertical
cards:
  - type: picture-elements
    elements:
      - type: conditional
        style:
          display: inline
          position: absolute
          transform: translate(0%, 0%)
          width: 100%
          top: 4%
          left: 2%
          bottom: 4%
          font-size: clamp(.75rem, 1.2vh, 2vh)
          overflow: hidden
          padding-right: 2%
        conditions:
          - entity: sensor.smt1500_1_status
            state_not: '0'
        elements:
          - type: image
            entity: sensor.smt1500_1_status
            title: SMT1500-1
            image: /local/lovelace/1500.png
            style:
              transform: translate(0%, 0%)
              width: 22%
              border-radius: .0%
              top: 5%
          - type: state-label
            entity: sensor.smt1500_1_status
            prefix: 'SMT1500-1: '
            style:
              transform: translate(0%, 0%)
              top: 0%
              left: 22%
              font-weight: bold
              width: 75%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_battery_runtime
            prefix: 'Runtime: '
            style:
              transform: translate(0%, 0%)
              top: 20%
              left: 60%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_input_voltage
            prefix: 'Input: '
            style:
              transform: translate(0%, 0%)
              top: 40%
              left: 60%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_battery_charge
            prefix: 'Battery: '
            style:
              transform: translate(0%, 0%)
              top: 20%
              left: 22%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_load
            prefix: 'Load: '
            style:
              transform: translate(0%, 0%)
              top: 40%
              left: 22%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_self_test_result
            prefix: 'Test: '
            style:
              transform: translate(0%, 0%)
              top: 60%
              left: 60%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_ups_temperature
            prefix: 'Temp: '
            style:
              transform: translate(0%, 0%)
              top: 60%
              left: 22%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
          - type: state-label
            entity: sensor.smt1500_1_energy_raw
            prefix: 'Energy use: '
            style:
              transform: translate(0%, 0%)
              top: 80%
              left: 22%
              width: 36%
              overflow: hidden
              margin-left: 15px
              margin-bottom: 10px
    image: /local/lovelace/smallcard.png
    aspect_ratio: 36%
21

Hi,
I have the same UPS. How did you setup the UPS to communicate with HA?
I currently just have my UPS connected with USB to a NAS-server so it can shutdown safely, but I’d like to monitor it in HA and use this card.

22

Network UPS tools (NUT) most likely. It’s compatible with most major manufacturers. Look in addons if you are running HAOS. Otherwise search online for NUT

23

sorry for the late reponse, but here it is:

#############################################
####### APC UPS 2200 Network card 9630 ######
#############################################
  - platform: snmp
    name: ups_smart_capacity_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.2.2.1.0
    accept_errors: true
    unit_of_measurement: '%'
  - platform: snmp
    name: ups_smart_runtime_remaining_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.2.2.3.0
    accept_errors: true
    value_template: >-
      {% set time = (value | int) / 100 | int %}
      {% set minutes = ((time % 3600) / 60) | int %}
      {% set hours = ((time % 86400) / 3600) | int %}
      {% set days = (time / 86400) | int %}
    
      {%- if time < 60 -%}
        Less than a minute
        {%- else -%}
        {%- if days > 0 -%}
          {{ days }}d
        {%- endif -%}
        {%- if hours > 0 -%}
          {%- if days > 0 -%}
            {{ ' ' }}
          {%- endif -%}
          {{ hours }}h
        {%- endif -%}
        {%- if minutes > 0 -%}
          {%- if days > 0 or hours > 0 -%}
            {{ ' ' }}
          {%- endif -%}
          {{ minutes }}m
        {%- endif -%}
      {%- endif -%}
  - platform: snmp
    name: ups_smart_load_percentage_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.4.2.3.0
    accept_errors: true
    unit_of_measurement: '%'
  - platform: snmp
    name: ups_smart_battery_temperature_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.2.2.2.0
    accept_errors: true
    unit_of_measurement: '°C'
  - platform: snmp
    name: ups_smart_battery_status_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.2.2.4.0
    accept_errors: true
    value_template: >-
      {%if value == '1' %}
        Good
      {% elif value == '2' %}
        Failed
      {% endif %}
  - platform: snmp
    name: ups_smart_type_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.1.1.1.0
    accept_errors: true
  - platform: snmp
    name: ups_smart_input_voltage_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.3.2.1.0
    accept_errors: true
    unit_of_measurement: 'V'
  - platform: snmp
    name: ups_smart_last_transfer_reason_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.3.2.5.0
    accept_errors: true
    value_template: >-
      {%if value == '1' %}
        No events
      {% elif value == '2' %}
        High line voltage
      {% elif value == '3' %}
        Brownout
      {% elif value == '4' %}
        Loss of mains power
      {% elif value == '5' %}
        Small temporary power drop
      {% elif value == '6' %}
        Large temporary power drop
      {% elif value == '7' %}
        Small spike
      {% elif value == '8' %}
        Large spike
      {% elif value == '9' %}
        UPS self test
      {% elif value == '10' %}
        Excessive input voltage fluctuation
      {% endif %}
  - platform: snmp
    name: ups_smart_output_load_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.4.2.3.0
    accept_errors: true
    unit_of_measurement: '%'
  - platform: snmp
    name: ups_smart_output_current_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.4.2.4.0
    accept_errors: true
    unit_of_measurement: 'A'
  - platform: snmp
    name: ups_smart_last_self_test_result_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.7.2.3.0
    accept_errors: true
    value_template: >-
      {%if value == '1' %}
        OK
      {% elif value == '2' %}
        Failed
      {% elif value == '3' %}
        Invalid Test
      {% elif value == '4' %}
        Test In Progress
      {% endif %}
  - platform: snmp
    name: ups_smart_last_self_test_date_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.7.2.4.0
    accept_errors: true
  - platform: snmp
    name: ups_smart_communication_status_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.8.1.0
    accept_errors: true
    value_template: >-
      {%if value == '1' %}
        on
      {% elif value == '2' %}
        off
      {% endif %}
  - platform: snmp
    name: ups_smart_status_2
    host: 192.168.178.12
    baseoid: 1.3.6.1.4.1.318.1.1.1.4.1.1.0
    accept_errors: true
    value_template: >-
      {%if value == '1' %}
        Unknown
      {% elif value == '2' %}
        On Line
      {% elif value == '3' %}
        On Battery
      {% elif value == '4' %}
        On Smart Boost
      {% elif value == '5' %}
        Timed Sleeping
      {% elif value == '6' %}
        Software Bypass
      {% elif value == '7' %}
        Off
      {% elif value == '8' %}
        Rebooting
      {% elif value == '9' %}
        Switched Bypass
      {% elif value == '10' %}
        Hardware Failure Bypass
      {% elif value == '11' %}
        Sleeping Until Power Returns
      {% elif value == '12' %}
        On Smart Trim
      {% endif %}
24

I have an issue.
I installed all dependencies, I replaced all of mine entities, but nothing is shown even an error:

image

Any suggestion?

Marco

25

Hard to give any suggestions since you have not posted a code.

26

You are rigth, sorry.
Here it is:

id: nuc_card
type: custom:config-template-card
variables:
  - states[''sensor.ups1500_status''].state
  - states[''sensor.ups1500_status''].state
  - states[''sensor.ups1500_battery_level''].state
  - states[''sensor.ups1500_load''].state
  - states[''sensor.ups1500_line_voltage''].state
  - states[''sensor.ups1500_battery_voltage''].state
entities:
  - sensor.ups1500_status
  - sensor.ups1500_status
  - sensor.ups1500_battery_level
  - sensor.ups1500_load
  - sensor.ups1500_line_voltage
  - sensor.ups1500_battery_voltage
card:
  type: entities
  show_header_toggle: 'off'
  style: |
    .card-header {
      padding: 0px 0px 0px 0px !important;
    }
  entities:
    - type: section
      style: |
        .label {
          text-align: center !important;
          margin-left: 0px !important;
          font-size: 17px !important;
        }
      label: ${ 'APC --- ' + vars[0] + ' --- ' + vars[1] }
    - type: custom:hui-element
      card_type: vertical-stack
      cards:
        - type: horizontal-stack
          cards:
            - type: picture
              style: |
                ha-card { 
                    --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                    --ha-card-background: "rgba(0, 0, 0, 0.0)";
                    --ha-card-box-shadow: 'none';
                }
              image: /local/wifi-guest.png
            - type: custom:button-card
              layout: icon_name_state2nd
              show_icon: true
              show_state: true
              styles:
                grid: null
                card:
                  - '--ha-card-background': rgba(0, 0, 0, 0.0)
                  - '--ha-card-box-shadow': none
                icon:
                  - padding: 10px 0px 0px
                  - height: 40px
                  - width: 40px
                state:
                  - padding: 10px 0px 0px
                  - justify-self: start
                  - font-family: Roboto, sans-serif
                  - font-size: 14px
                name:
                  - padding: 20px 0px 0px
                  - justify-self: start
              entity: sensor.ups1500_runtime_left
              name: 'Remaining:'
              icon: mdi:battery-high
        - type: horizontal-stack
          cards:
            - type: custom:bar-card
              show_icon: true
              align: split
              columns: 1
              max: 100
              positions:
                icon: inside
                indicator: inside
                name: inside
                value: inside
              unit_of_measurement: '%'
              severity:
                - value: 50
                  color: '#3498db'
                - value: 75
                  color: '#f39c12'
                - value: 100
                  color: '#e45e65'
              style: |
                ha-card { 
                  --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                  --ha-card-background: "rgba(0, 0, 0, 0.0)";
                  --paper-item-icon-color: 'var(--text-primary-color)';
                  --ha-card-box-shadow: 'none';
                }
                bar-card-name {
                  margin-left: -10px;
                }
              entity: sensor.ups1500_battery_level
              name: Battery
              icon: mdi:battery-high
              entity_row: true
            - type: custom:bar-card
              show_icon: true
              align: split
              columns: 1
              max: 100
              positions:
                icon: inside
                indicator: inside
                name: inside
                value: inside
              unit_of_measurement: '%'
              severity:
                - value: 50
                  color: '#3498db'
                - value: 75
                  color: '#f39c12'
                - value: 100
                  color: '#e45e65'
              style: |
                ha-card { 
                  --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                  --ha-card-background: "rgba(0, 0, 0, 0.0)";
                  --paper-item-icon-color: 'var(--text-primary-color)';
                  --ha-card-box-shadow: 'none';
                }
                bar-card-name {
                  margin-left: -10px;
                }
              entity: sensor.ups1500_load
              name: Load
              entity_row: true
        - type: entities
          entities:
            - entity: sensor.ups1500_line_voltage
              name: Input Voltage
              icon: mdi:power-plug
            - entity: sensor.ups1500_battery_voltage
              name: Battery Voltage
              icon: mdi:battery-charging-high
          style: |
            ha-card { 
                --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                --ha-card-background: "rgba(0, 0, 0, 0.0)";
                --paper-item-icon-color: 'var(--text-primary-color)';
                --ha-card-box-shadow: 'none';
            }
27

Is it your card or taken from somewhere?

28

Yes,
I took from 1st post on this thread, with my entities

Marco

29

First entity is duplicated, fix this first and remove the first entity from both variables and entities sections at the top of the code. If still not showing it means one or more of the entities you have at the top does not exist, you can remove them 1 at a time if you need to then you can see what one is causing the error…

30

Hi,
replaced 1st entity and removed one by one, but still not work. All entities exist, and work, they are used in another UPS card I have

id: nuc_card
type: custom:config-template-card
variables:
  - states[''input_text.termostato_stato''].state
  - states[''sensor.ups1500_status''].state
  - states[''sensor.ups1500_battery_level''].state
  - states[''sensor.ups1500_load''].state
  - states[''sensor.ups1500_line_voltage''].state
  - states[''sensor.ups1500_battery_voltage''].state
entities:
  - input_text.termostato_stato
  - sensor.ups1500_status
  - sensor.ups1500_battery_level
  - sensor.ups1500_load
  - sensor.ups1500_line_voltage
  - sensor.ups1500_battery_voltage
card:
  type: entities
  show_header_toggle: 'off'
  style: |
    .card-header {
      padding: 0px 0px 0px 0px !important;
    }
  entities:
    - type: section
      style: |
        .label {
          text-align: center !important;
          margin-left: 0px !important;
          font-size: 17px !important;
        }
      label: ${ 'APC --- ' + vars[0] + ' --- ' + vars[1] }
    - type: custom:hui-element
      card_type: vertical-stack
      cards:
        - type: horizontal-stack
          cards:
            - type: picture
              style: |
                ha-card { 
                    --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                    --ha-card-background: "rgba(0, 0, 0, 0.0)";
                    --ha-card-box-shadow: 'none';
                }
              image: /local/wifi-guest.png
            - type: custom:button-card
              layout: icon_name_state2nd
              show_icon: true
              show_state: true
              styles:
                grid: null
                card:
                  - '--ha-card-background': rgba(0, 0, 0, 0.0)
                  - '--ha-card-box-shadow': none
                icon:
                  - padding: 10px 0px 0px
                  - height: 40px
                  - width: 40px
                state:
                  - padding: 10px 0px 0px
                  - justify-self: start
                  - font-family: Roboto, sans-serif
                  - font-size: 14px
                name:
                  - padding: 20px 0px 0px
                  - justify-self: start
              entity: sensor.ups1500_runtime_left
              name: 'Remaining:'
              icon: mdi:battery-high
        - type: horizontal-stack
          cards:
            - type: custom:bar-card
              show_icon: true
              align: split
              columns: 1
              max: 100
              positions:
                icon: inside
                indicator: inside
                name: inside
                value: inside
              unit_of_measurement: '%'
              severity:
                - value: 50
                  color: '#3498db'
                - value: 75
                  color: '#f39c12'
                - value: 100
                  color: '#e45e65'
              style: |
                ha-card { 
                  --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                  --ha-card-background: "rgba(0, 0, 0, 0.0)";
                  --paper-item-icon-color: 'var(--text-primary-color)';
                  --ha-card-box-shadow: 'none';
                }
                bar-card-name {
                  margin-left: -10px;
                }
              entity: sensor.ups1500_battery_level
              name: Battery
              icon: mdi:battery-high
              entity_row: true
            - type: custom:bar-card
              show_icon: true
              align: split
              columns: 1
              max: 100
              positions:
                icon: inside
                indicator: inside
                name: inside
                value: inside
              unit_of_measurement: '%'
              severity:
                - value: 50
                  color: '#3498db'
                - value: 75
                  color: '#f39c12'
                - value: 100
                  color: '#e45e65'
              style: |
                ha-card { 
                  --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                  --ha-card-background: "rgba(0, 0, 0, 0.0)";
                  --paper-item-icon-color: 'var(--text-primary-color)';
                  --ha-card-box-shadow: 'none';
                }
                bar-card-name {
                  margin-left: -10px;
                }
              entity: sensor.ups1500_load
              name: Load
              entity_row: true
        - type: entities
          entities:
            - entity: sensor.ups1500_line_voltage
              name: Input Voltage
              icon: mdi:power-plug
            - entity: sensor.ups1500_battery_voltage
              name: Battery Voltage
              icon: mdi:battery-charging-high
          style: |
            ha-card { 
                --paper-card-background-color: 'rgba(0, 0, 0, 0.0)';
                --ha-card-background: "rgba(0, 0, 0, 0.0)";
                --paper-item-icon-color: 'var(--text-primary-color)';
                --ha-card-box-shadow: 'none';
            }
31

I see the problem now, variables should be like this:

variables:
  - states['input_text.termostato_stato'].state
  - states['sensor.ups1500_status'].state
  - states['sensor.ups1500_battery_level'].state
  - states['sensor.ups1500_load'].state
  - states['sensor.ups1500_line_voltage'].state
  - states['sensor.ups1500_battery_voltage'].state
1 Like