Smart Home Junkie | Create Stunning ANIMATED MUSHROOM CARDS On Your Dashboard NOW! @SmartHomeJunkie | Uploaded November 2022 | Updated October 2024, 10 hours ago.
This video is going to change the way your dashboard looks in Home Assistant. Forever. Let me rephrase that. Starting today, your dashboard will look Awesome, just awesome with these ANIMATED MUSHROOM CARDS!

NOTE: Since version 3.0.0 of Mushroom cards, the CSS has changed. You need to replace ha-icon with ha-state-icon. You also need to change the structure of the code because the structure of the DOM has changed.

For instance:
card_mod:
style: |
ha-state-icon {
{{ '--icon-animation: spin 1s linear infinite;' if is_state('input_boolean.airconditioning_power', 'on') }}
}

And another change since version v3.0.5:

CHANGE --icon-animation: TO animation:

⭐ You can download the UPDATED code that I created for this video at: ko-fi.com/s/1f154c6358 ⭐

Links referred to in this video:
* Install HACS: youtu.be/Q8Gj0LiklRE
* How To Cycle Through Scenes Like Hue Using a Button in Home Assistant: youtu.be/nBdDdC2jVUc
* Create your own Garden Watering System: youtu.be/e8mlJBce3uQ
* You've Got Mail in Home Assistant: youtu.be/-4KGdPh6ur0
* How To Monitor Your Washing Machine: youtu.be/ZGLcDmm8Fp8
* Material Design Icons site: materialdesignicons.com
* CSS Clip Path Generator: cssportal.com/css-clip-path-generator
* More examples of animated mushroom cards: community.home-assistant.io/t/mushroom-cards-build-a-beautiful-dashboard-easily/388590/3240

Blog version: smarthomejunkie.net/create-stunning-animated-mushroom-cards-on-your-dashboard-now

⭐⭐⭐
* Join this channel to get access to perks: 📺 youtube.com/c/smarthomejunkie/join
* Please consider becoming my patron 🏅 at patreon.com/join/smarthomejunkie
* Or please support me by buying me a ☕ at ko-fi.com/smarthomejunkie
⭐⭐⭐

My Devices: github.com/smarthomejunkie/MyDevices

Instagram: instagram.com/smarthomejunkie
Twitter: twitter.com/smarth0mejunkie
Facebook: facebook.com/smarthomejunkie
TikTok: tiktok.com/@smarthomejunkie
Discord: discord.gg/at8v5hW

Music by:
* 2TECH-AUDIO: 2tech-audio.bandcamp.com

00:00:00 Introduction
00:01:34 Install Card-Mod
00:02:43 Explain the animated chips
00:03:04 Edit the chips card
00:07:11 Download the MDI icon for polygon use
00:07:47 Apply the clip path to our animation
00:09:25 Create the animated airconditiong card
00:10:05 Create the animated scenes cards
00:11:09 Edit the animated Light Mushroom cards
00:12:03 Create the Animated Sprinkler Card and the Animated Washing Machine Card
00:12:55 Create the Washing Machine Animated Card

#homeassistant #animation #animated #animateddashboard #dashboard #mushroom #tutorial #smarthome #homeautomation