Change Icon Color Binary_Sensor

Configuration
1

HI All!
I’m moving my first steps into HA, I’m trying the Ping component to check if my network devices are online:


I can already use it, but it’s possible to change the icon color based on the status of the devices? for example RED if disconnected and GREEN if it’s connected…
I’ve tryed this code in the customize.yaml file but it doesn’t work…
Any help? 
binary_sensor.pfsense:
   templates:
        rgb_color: "if (state === 'Connesso') return [255, 255, 0]; else return [255, 0, 0];"

Thank you very much!
Simone

2

unless something has changed that I’ve not noticed (quite possible), the only way is to install something like GitHub - andrey-git/home-assistant-custom-ui: Custom UI elements for https://home-assistant.io first.

3

From 106 you should be able to use something like this:

              - entity: binary_sensor.tasmota_update_available
                state_color: true
                style: |
                  :host {
                  --paper-item-icon-active-color: rgb(255, 223, 0);
                  }

Or even this:

              - entity: sensor.artisan_software_version
                style: |
                  :host {
                  --paper-item-icon-color:
                    {% if states(config.entity) != 'v2.1.2' %}
                      rgb(255, 223, 0)
                    {% else %}
                      var(--disabled-text-color)
                    {% endif %}
                    ;
                  }

Might take a bit of mucking around to see what your theme is using there…

4

Thanks! I’ve found this post but I can’t make it work:
Need help with sensor icon color based on state
tomorrow I’ll do more test…

5

Another option is to use custom:template-entity-row or custom:button-card but I would recommend to learn a bit about python/jinja/JS/CSS before going that route.