Dashboard Tile Color based on Attribute name

Is there a trick to make a tile background color specific to an attribute name, where most tiles on the dash are "attribute" template? To wit, I'm using the best Aeon HEM Gen 5 driver I can find, and to get the data I want on a dashboard, I need to use the "attribute" template to extract Power, Energy, Duration, Voltage, Current, etc. I'd like to, for example, make the Voltage tile 50% alpha "blue" (or some such variation), the Energy tile "orange", etc. So far as I can find, since most tiles use the "atttribute" template, changing the color of one changes them all. I'm looking for a way to differentiate based on the secondary label, which is called "templateExtra" in the advanced js section.

I can't see a way to do it based on the attribute name, the best I can come up with is that per individual tile you can set the background colour using the Custom CSS section. Something like:

#tile-6 { background-color: rgba(0,0,255,0.4) !important; }

Where you need to replace #tile-6 with the tile id of the tile you want to adjust. You can also do this for multiple tiles at a time:

#tile-5, #tile-6 { background-color: rgba(0,0,255,0.4) !important; }

Yeah, thanks! While not fully elegant, this does work, and I don't really expect to make changes any time soon!

1 Like