2022.12 Color states are broken/unusable

thank you so much, I believe that this will fix any of the issues I currently have :slight_smile:

Can you again explain shortly the reason for this and/or the needed differences to other classes?

Believe this is still not working as hoped for ?

Climate entity is idle but still the Heating (Verwarmen) is causing the red color.
2022.12.5

Pr Fix climate hvac action color by piitaya ¡ Pull Request #14747 ¡ home-assistant/frontend ¡ GitHub

Again, more-info is correct:

Auto is green even when idle.

heating on, green flame:

and because those are my themed colors (sorry for posting those), here’s the default:


It’s working correctly for me. Icon is gray when set to heat (but not heating) and it is red when set to heat and heating.

Do not find this logical.

My thermostat is set to heat mode, keeping the house temperature at 74 degrees, however the house is currently at 74 so it is not currently producing heat (hvac_action is idle).

This is how the climate entity icons coloring has worked for a very long time prior to 2022.12

Thanks. Looks like this should correct a few more issues. :slight_smile: Updating now…

That would be great! As well as history color of the entity states!

For me a keyword was “grey” - and grey colors here were introduced not " a very long time prior to 2022.12".
Once again - I do not think that the “set to heat (but not heating)” state should be grey.
And again - if all colors are themeable then it is unimportant if it is grey magenta or striped; but all possible states must have their own variable.

2 Likes

You’re right, I should have been clear, gray is due to my theme inactive-color. When using the default theme it is blue when idle but redish-orange when heating

I see, this is just your custom theme :+1:

1 Like

My short reaction is this. With the .5 I now load this extra module in configuration.yaml

document.documentElement.style.setProperty('--rgb-state-cover-color', 'var(--rgb-orange-color)');
document.documentElement.style.setProperty('--rgb-state-alarm-disarmed-color', 'var(--rgb-green-color)');
document.documentElement.style.setProperty('--rgb-state-alarm-armed-color', 'var(--rgb-red-color)');

I have a personal preference against that purple state colour but I have to accept that the colour for a state of a curtain is a matter of taste

But the two others are for alarm on and alarm off. And there I must insist on alarm off to be the normal green and the red colour to be alarm armed. As I remember alarmed triggered is flashing but I have not been able to test that yet as it sets off armageddon in the house.

And also a reminder that the documentation for Picture Elements Card needs a detailed description for how to change colour for individual items which is how seriously complex because you have to know the name of the style depending on the type of entity. Hopefully long term (not patch release) we get the ability to define state colours for individual entities in the UI so you do not need to use geeky css hacks in cards

This still appears to be broken in .5 - I’ve just updated.

2 Likes

shouldn’t be the “lock” already be fixed (unlocked / locked state) in HA 2022.12.5 ? or will come with one of the next updates - or did I miss anything?

It appears to be in the correct color in the history:
grafik

Unfortunately, my Car does Auto-Lock itself too early, so I can’t check the unlocked state atm… :-/

2 Likes

For now, only active states are colored on card (button, entity, entities and glance) and the lock locked is a inactive state (as before 2022.12). This is a technical limitation to avoid coloring the default dark blue to grey on card but that’s a thing we need to improve :slightly_smiling_face: there is the same problem with not_home state for person and device_tracker.

6 Likes

Just wanted to note, using the colors red and green without any other way to differentiate the state of the thing is generally frowned upon in design since about 12% of the world is red green colorblind. If HA is going to pick the colors for you, picking red and green is not a good idea for accessibility reasons.

But it would be great if you had a way to set it this way for yourself since I assume you and your family are on the 88% side.

2 Likes

Just to explain the color choice about alarm :
Safe state is green so armed alarm and locked lock are green.
If you don’t like it, you can change it with themes.

3 Likes

I am seeing colour changes to the icons for my binary sensors on the Glance Card but not the Entities Card. Anyone else confirm? Edit: looks like the same issue with switches and automations (maybe automations never had an on colour?) Light works. this is with 2022.12.5

all right, thanks for the explanation :slight_smile:
In this case, I have mis-interpreted the previous PR where the red/green color state has been mentioned as such, that this has was already possible :slight_smile: :+1:

Yep

Green is safe. Safe to open the door without setting off the alarm. :stuck_out_tongue:

It is a change from before 2022.12. Whoever designed the original alarm related UI felt the same about it as some of us have stated. But yes, we can theme it right or do the permanent js hack so it applies to also my families devices without having to check their themes.

2 Likes