If you like you can support my work.

Custom Weather page with animated icons.

• Animated weather pictures

• 4 day forecast displayed

• ability to receive data from your own sensors including the pws.

• Full dynamic structure

Before we start, we need some third party tools from Hacs:

• Layout card : https://github.com/thomasloven/lovelace-layout-card

• Button card: https://github.com/custom-cards/button-card

• Mushroom cards: https://github.com/piitaya/lovelace-mushroom

• Stack in card : https://github.com/custom-cards/stack-in-card

• Platinum weather card : https://github.com/Makin-Things/platinum-weather-card

• Card Mod: https://github.com/thomasloven/lovelace-card-mod

You will also need a weather integration for forecast. The one I use is accuweather. For installation you can refer to youtube videos.

• Accuweather installation Youtube: https://www.youtube.com/watch?v=DXehQBgdsHk

After installing all the necessary components just copy and paste below code to your home assistant dashboard and the new page w ll be ready.

Page Code : https://github.com/berkansezer77/home-assistant/blob/main/pages/weather-page/page-code

You can download all gifs and icons used in the page plus many extra from below link. https://www.dropbox.com/s/6aynbjqo3hhe483/weather.zip?dl=0

Main Page Code:

This is a separate page containing weather information. You can also shprtcut this page from the main page with some little icons and weather info.

You can find the main page code down below :

https://github.com/berkansezer77/home-assistant/blob/main/pages/weather-page/main-page-code