Feature Request - Option to change the colors

[just123smil]

All said in the title: It would be great to have the possibility to change the colors, so that e.g. my house-bubble with its icon and values can be pink, the for the extra bubble 1 brown and for the extra bubble 2 black, so it matches better my personal dashboard-theme.

I took a look myself, but I can't find where the colors "info", "warning", "success" are defined?

[reptilex]

Not that difficult but is not a prio currently since I'm trying to change the whole animation ... without any spare time ...

[Chris-489]

All said in the title: It would be great to have the possibility to change the colors, so that e.g. my house-bubble with its icon and values can be pink, the for the extra bubble 1 brown and for the extra bubble 2 black, so it matches better my personal dashboard-theme.

I took a look myself, but I can't find where the colors "info", "warning", "success" are defined?

I use Lovelace with Iobroker and have added it to themes in the Lovelace settings.

warning-color: '#73bf69' info-color: '#f92aad'

Maybe this already helps you or someone else

[GregorEstebanCardosoSchiller]

Hi, an example for you here just using the plugin "card-mod":

style: |

tesla-style-solar-power-card > div.acc_center > div >

div.acc_td.acc_appliance2 > div {
  border-color: red;
  color: red;
}
#tesla-style-solar-power-card > div.acc_center > div > 
div.acc_td.acc_appliance1 > div {
  border-color: grey;
  color: grey;
}
#tesla-style-solar-power-card > div.acc_center > div > 
div.acc_td.acc_right > div {
  border-color: #4db6ac;
  color: #4db6ac;
}
#tesla-style-solar-power-card > div.acc_bottom > div > 
div {
  border-color: #f06292;
  color: #f06292;
}
#appliance2_consumption_entity_line {
  stroke:red!important
}
#appliance2_consumption_entity_circle {
  fill:red!important
}
#appliance1_consumption_entity_line {
  stroke:grey!important
}
#appliance1_consumption_entity_circle {
  fill:grey!important
}
#grid_to_house_entity_line {
  stroke: #488fc2!important
}
#grid_to_house_entity_circle {
  fill: #488fc2!important
}
#grid_to_battery_entity_line {
  stroke: #e1e1e1!important
}
#grid_to_battery_entity_circle {
  fil: #e1e1e1!important
}
#generation_to_battery_entity_line {
  stroke: #f06292!important 
}
#generation_to_battery_entity_circle {
  fill: #f06292!important 
}
#generation_to_grid_entity_line {
  stroke: #a280db!important 
}
#generation_to_grid_entity_circle {
  fill: #a280db!important 
}
#battery_to_house_entity_line {
  stroke: #4db6ac!important 
}
#battery_to_house_entity_circle {
  fill: #4db6ac!important 
}
.acc_text, .acc_text_extra {
font-size: 12px!important
}
:host {
    --card-mod-icon-color: white;
}