2022.12 Color states are broken/unusable



      color: >
        {{iif(states[config.entity].state == 'on','red','black')}}

does its job here

(secret: I havent even set active: true…)

1 Like

Just realized that the icons for my living room lamps that are displayed using fold entity row are working perfectly. A bit of hope that what’s working in that addon could be implemented in others.

The “color” is an undocumented and a bit strange option; seems to work with an entity specified.

type: entities
  - type: custom:template-entity-row
    icon: mdi:car
    color: red
  - type: custom:template-entity-row
    entity: sun.sun
    icon: mdi:car
    color: cyan
  - type: custom:template-entity-row
    entity: sun.sun
    icon: mdi:car
    color: cyan
    active: false
  - type: custom:template-entity-row
    entity: sun.sun
    icon: mdi:car
    color: cyan
    active: true
1 Like

Also having some Entities show the same colour for On and Off - This is a binary_sensor.grid_status

Upgrade to the latest version and clear your web browser cache.


Just peeking in. As mentioned, been lazily following this endless debate and I guess, many others too.

What I believe many of us is waiting, is something stable on which we can build and customize our UIs to our liking. Currently most of my UI is themed & customized and because of the change I see it more and more the needed (wasn’t the purpose of this UI change somewhat the opposite?). My UI is somewhat OK because on theming and special cards, but everything based on core defs is not. In a fear that also the variables the themes and cards are using are breaking, I have stopped updating my main installation in 2022.11.5.

Also a large amount of users are using picture elements cards mainly showing the unique floorplans, and css support there is poor. Not even mentioning the manual tinkering needed and especially scalability between viewports. Those needs to be improved also.

Is this current direction optimized to mobiles? I wonder why, they have a ridiculous sized screens and keyboards are even worse. Due to the climate change, energy crisis, remote work etc. we should also reduce our mobility, by the way. If needed to use by phone, I rather pack everything on as small surface as possible, eg. entities cards compared to space-taking tiles and so on.

I recall a document by the ui developers were promised including e.g. new css variables? 2022.12 Color states are broken/unusable - #169 by piitaya

Is that released yet? I think I’ve not come across to that, anyway?


I wholeheartedly Agree with you! I like a “dense” dashboard. I really appreciated the consistent and reliable interface, it was easy for family to pick up.

1 Like

The two colours used on the history graph of a motion sensor are almost indistinguishable (different shades of yellow). They used to be red and green. The current colours have almost no contrast and are completely unsuited for this purpose.

Having skimmed through this thread, there seems to be no easy or obvious way to change the colours to something usable/appropriate.

I consider this is a significant regression.

Are you on the latest version?
That’s how it looks like on default theme:

I was on 2022.12.4 but since you asked I updated to 2022.12.7 which is as of this writing the latest version. Colours didn’t change.

Schermafdruk van 2022-12-19 11-17-01

The colours did change, but not right after the update.

Schermafdruk van 2022-12-19 11-30-26

While definitely an improvement still not as good as they were before 2022.12, having them configurable would be even better.

They are configurable. Through themes. See the post marked as the solution to this topic.


Please, stop touching this! 7 Hotfix to fix that… If you read my top posts I was supporting the team about the last changes done and calming down the angry people but with every fix you are messing it up more. I’ve spent hours on every hotfix fixing the theme files. Definitely as an engineers we have to understand that this feature deploy has been a mistake as it’s been launched wtihout AB testing and affecting all users. And as all the mistakes in engineers the way to proceed in that case is by a rollback until you have a proper deploy plan for the next release.

This release, that only affects UI really make me question if this project is growing too fast.

Now I have screwed up state-lock-unlocked-color as this color is not added… My god! The colors are added one by one in every hotfix…


I have read through this thread about colours in the Dashboard but cannot find an answer to my question, apologies if I’ve missed it - a steer towards the answer would be most welcome.

Otherwise, my Dashboard includes history graphs for two binary sensors: one is the status of a ping that checks if my broadband is up or down; and the other is a Raspberry Pi power status that shows if there is a power error or not.

When I created these history graphs the default colours were fine:

  • ping on = green (= broadband up), ping off = red (broadband down); and
  • power error off = green.
    I don’t know what colour power error on would have been, I’ve not seen an error yet, but I’m guessing it would have been red.

Perhaps I got lucky with the default colours, but now, after upgrading to 2022.12 I’ve got:

  • ping on = yellow, ping off = grey; and
  • power error off = grey.

Please can someone tell me how I can make easy changes - I’m not a programmer - to get back to the colours I used to have for these two sensors?

Many thanks.

You can’t change the grey. It is hard coded. You can change the yellow using a theme. See the post marked as the solution to this topic.

1 Like

For off in History Grapph you have to customize the theme variable rgb-state-inactive-color .


Thanks for your quick reply.

I had seen that solution but I (perhaps mistakenly?) thought it would set all of my binary sensors to be either amber or red when not off:

“state-binary-sensor-alerting-color: ‘#F44336’ # Red
state-binary-sensor-color: ‘#FFC107’ # Amber”

My two binary sensors work opposite to each other, I’d like one red when off (ping) and one red when on (power supply error).

Can I include actual sensor names in the themes.yaml with different colour options for each sensor?

Thanks again.

If you go creative with picture elements card then you can control the colours of individual entities for both on and off. See my earlier posts where I describe how

You are out of luck.

Hi! So this is working for you, using template entity row, to have the icons light up with your chosen color when they are active?

Thanks for the ongoing replies, I will follow up on the ideas suggested.

But I suppose I was really hoping it would be as easy as setting multiple colours in the gauge card as shown in this image:

Any way of asking if that could be included in a future release please?