Everyone,
I am trying to embed weather information next to the date as shown in the picture below using the darksky_summary sensor which works great although I cannot to find a way to change the icon color, can anybody point me in the right direction here?
I have googled and read all possible threads on how to use sensor templates but this does not seem to apply to this case, am I missing something?
Thanks in advance
Alright folks I came up with the following workaround hopefully someone will find it useful.
-
Downloaded all the weather icons from mdi icon here (thanks Austin for making this available to the community) in .svg format and moved them to config/www/images folder. Also renamed the weather-sunny.svg icon to weather-clear-day.svg (as that is the nomenclature used by Dark Sky).
-
Modified their fill color to white (as I have a dark background) with Inkscape.
-
Created the following sensor template (in sensor.yaml, if you haven’t split the config.yaml file this code goes into config.yaml file):
# Dark Sky weather icon
- platform: template
sensors:
weather_icon_template:
friendly_name: 'weather icon'
value_template: >
{{states('sensor.dark_sky_icon')|capitalize|replace('-',' ')}}
entity_picture_template: >-
{{ '/local/images/' ~ 'weather-' ~ states('sensor.dark_sky_icon') ~ '.svg'}}
entity_id:
- sensor.dark_sky_icon
-
Checked the config file to get the final all-clear.
-
Restarted Home Assistant and added the following picture-elements card to my raw configurator:
type: picture-elements
aspect_ratio: 8%
elements:
- entity: sensor.weather_icon_template
style:
left: 50%
top: 50%
type: state-icon
image: /local/images/Clock-bg.png
Result (the icon will change according to the Dark Sky icon):