[Solved] Customize scene icon color in Picture Glance Card

Configuration Frontend
1

Hi guys

Is it possible to customize scene icon color in Picture Glance Card ?

I try that, but it’s not working :

customize.yaml

scene.salon_lampes_random:
  icon_color: rgb(6, 16, 204)

lovelace :

          - type: picture-glance
            title: Cuisine
            entities:
              - scene.salon_lampes_random
              - light.cuisine_plafond
            state_image:
              "on": /local/img/cuisine_on.png
              "off": /local/img/cuisine_off.png
            entity: light.cuisine_plafond

Thanks !

2

Impossible ?

3

You have to do it through lovelace with styles. Using the custom card modder card.

1 Like
4

Hi @petro

I tried with that :

          - type: "custom:card-modder"
            style:
              --paper-item-icon-color: green
              border-radius: 5px
              color: rgb(0, 0, 100)
            card:
              type: picture-glance
              title: Cuisine
              tap_action: 
                action: toggle
              hold_action: 
                action: more-info
              entities:
                - scene.cuisine_plafond_tamisee
                - scene.cuisine_plafond_forte
                - light.cuisine_plafond
              state_image:
                "on": /local/img/cuisine_on.png
                "off": /local/img/cuisine_off.png
              entity: light.cuisine_plafond

but css seems to use class with no variable) :

    ha-icon.state-on {
        color: white;
    }
    ha-icon {
        cursor: pointer;
        padding: 8px;
        color: #a9a9a9;
    }
1 Like
5

if it’s ha-icon, then that’s what you want to override. Not 100% sure this will work but it’s worth a shot.

style:
  ha-icon-color: rgb(0, 0, 100)

@thomasloven any other suggestions?

1 Like
6

Good idea, but it does not work …

7

Try "--iron-icon-fill-color": rgb(0,0,100)

2 Likes
8

It works, thank you very much !
Is-it possible to have two differents colors, one for ha-icon and one for ha-icon.state-on ?
I would like to have differents colors for scenes entities and lights entities ?

9

Afraid not.

10

That’s what I thought, thanks again !

11

You could use the template card to template this color:

12

Could you possibly share your working code? I’m trying to do a similar thing but a bit of a CSS NOOB.

13 
          - type: "custom:card-modder"
            style:
              --iron-icon-fill-color: rgb(0,0,100)
            card:
(...)
14

Thank you! I see my problem though. I’ve been trying to do this in custom:card-mod instead as I noted that custom:card-modder had been deprecated.

1 Like
15

How to get the same with card-mod instead of card modder?

card_mod:
style: |
ha-card {
–iron-icon-fill-color: rgb(255,0,0)
}

does not work for me :frowning: