Custom UI - icon color change

Is rgb_color working anymore with custom_ui for you all? Looks like we need to switch to hs_color

2 Likes
homeassistant:
  customize:
    sensor.central:
      templates:
        rgb_color: [255,0,0]

is this expected to work for example ?

I am getting this :

2018-04-03%2000_15_40-Home%20Assistant

primary-text-color: works to change a text color.
But rgb_color, label-badge-red and any other combination not working to change badge color.

Hi @anon57099626

What transport sensor are you using for your tube I.e. central line ?

thanks @Vlad for your comment, looking at https://github.com/andrey-git/home-assistant-custom-ui/issues/126 it seems that rgb_color was working to modify the icon colors, but now it’s broken.

@bachoo786 https://www.home-assistant.io/components/sensor.london_underground/

1 Like

Even though I was the OP, can I suggest that this issue is moved to CustomUI - discussion thread . That way you can be more sure hat @andrey is aware.

Ok Got the Custon_ui badges colour to work.

Had to use customize_glob.yaml

"*":
  custom_ui_state_card: state-card-custom-ui  

"sensor.window_*":
  state_card_mode: badges
  templates:
    theme: >
      if (state === 'Open') return 'red_badge'; else return 'green_badge';

"sensor.door_*":
  state_card_mode: badges
  templates:
    theme: >
      if (state === 'Open') return 'red_badge'; else return 'green_badge';

"*_temperature":
  state_card_mode: badges
  templates:
    theme: >
      if (state > 21) return 'hot'; else if (state >= 19 ) return 'comfortable'; else return 'cold';

"*_humidity":
  state_card_mode: badges
  templates:
    theme: >
      if (state > 65) return 'hot'; else if (state >= 55 ) return 'comfortable'; else return 'cold';

24%20am

Hi
can you please explain what you did (step by step)?

Guys, do you know if I could spread the badges a bit more or put them in center?

1 Like

Good evening. The customize for icon color change used to work but now doesn’t. My custom ui version is CustomUI: 20180330
Please kindly advice.

customize:
    binary_sensor.door_back_sensor:
      templates:
        rgb_color: "if (state === 'on') return [200, 100, 30]; else return [10, 20, 30];"

See CustomUI - discussion thread - there has been a change in HA colour usage

2 Likes

Thank you very much.

Regards Norick, could you share the “script” of this group, to learn how it is done for my system? Thank you.

Hey @Rhoos, what exactly you want me to share?

Greetings @Norik_Krasniqi, I am very new to Hass’ world and I would like you to share how you made this group of icons and their data. Thank you very much!

Captura

Here is my current config (the coloring now working right now)

sensor.yaml

- platform: systemmonitor
    resources:
      - type: disk_use_percent
        arg: /home
      - type: processor_use
      - type: memory_use_percent
      - type: last_boot
      - type: since_last_boot

- platform: sql
    db_url: mysql://XXXXX:XXXXX@localhost/homeassistant
    queries:
      - name: DB Size
        query: 'SELECT table_schema "homeassistant", Round(Sum(data_length + index_length) / 1024 / 1024, 1) "value" FROM information_schema.tables WHERE table_schema="homeassistant" GROUP BY table_schema'
        column: 'value'
        unit_of_measurement: MB

- platform: speedtest
    minute:
      - 0
      - 15
    monitored_conditions:
      - download
      - upload
      - ping

- platform: template
    sensors:
      since_last_boot_templated:
        value_template: >-
          {%- set slb = states.sensor.since_last_boot.state.split(' ') -%}
          {%- set count = slb | length -%}
          {%- set hms = slb[count - 1] -%}
          {%- set hms_trimmed = hms.split('.')[0] -%}
          {%- set hms_split = hms_trimmed.split(':') -%}
          {%- set hours = hms_split[0] | int -%}
          {%- if count == 3 -%}
            {{ slb[0] ~ ' ' ~ slb[1] ~ ' ' }}
          {%- endif -%}
          {%- if hours > 0 -%}
            {%- if hours == 1 -%}
              1 hour
            {%- else -%}
              {{ hours }} hours
            {%- endif -%}
          {%- endif -%}

- platform: version
    name: Installed Version

- platform: scrape
    resource: https://www.home-assistant.io
    name: Latest Release
    select: ".current-version h1"
    value_template: '{{ value.split(":")[1] }}'
2 Likes

Thank you very much for sharing @Norik_Krasniqi, every day we learn more :slight_smile:

Can you help me with a link on how to get the sql stuff set up?

i try this solution in my customize.yaml and it not working to change color of badge for my tempo… Still is RED color.

sensor.eurochron_0001_temp:
  state_card_mode: badges
  templates:
    theme: >
      if (state > 29) return 'hot'; else if (state >= 27 ) return 'comfortable'; else return 'cold';

I try change icon color for switch, but when switch is ON all is ok and color is GREEN, but when is off should be RED but it is light blue. Why ?

templates:
  hs_color: "if (state === 'on') return [98,158,81]; else if (state === 'off') return [191,27,0];"

1