Change image color with CSS

Configuration Frontend
1

I can’t figure out this simple thing. I have this white rectangle and can’t figure out how to change the color through css, is it even possible? I tried this:

                    - type: image
                      entity: light.q_lavabo
                      image: /local/pruebas_mapa/rectangulo.png
                      state_filter:
                        "on": brightness(90%) hue-rotate(120deg) saturate(100)
                      style:
                        top: 50%
                        left: 50%

image
image810×738 107 KB

It does react to brightness though

2

White isn’t a color, it is equal value of all colors. So Afaik hue rotate won’t change white. You’d need to supply a non-white, preferrably primary color for maximum results.

1 Like