Mastering card mods in Home Assistant & Shadow DOM | Advanced Styling

Опубликовано: 20 Май 2026
на канале: All Automatic

7,364

212

In this video, I'll show you how to customize your Home Assistant with the card-mod extension! Learn how to stylize deeply nested elements in your Lovelace cards and how to traverse the Shadow DOM. I'll provide practical examples of how to customize gauge cards and labels, as well as tips for styling isolated elements. Perfect for anyone who wants to take their Home Assistant dashboard to the next level!

... ► Links to the video:

lovelace-card-mod: https://github.com/thomasloven/lovela...

► My snippet collection: https://bit.ly/aa-snippets

► I appreciate your support:

https://bit.ly/alles-automatisch
https://www.paypal.com/paypalme/dboberg
https://amzn.eu/0gxpJN3M

► My equipment:
Lighting: https://amzn.to/49Ip1XR
Camera: https://amzn.to/3wpbzKa
Lens: https://amzn.to/4bK2knP
Microphone: https://amzn.to/3I8ovGT

► Join the community:

WhatsApp: https://bit.ly/wa-aa
Discord: https://bit.ly/aa-dics

► Playlist Recommendations:

Home Assistant:    • Home Assistant: Tutorials, Dashboards & Au...
Home Assistant Basics:    • Home Assistant Grundlagen – Einstieg, Enti...
Making Automations:    • Automatisierungen mit Make.com – Apps verb...
Smart Home & Gadgets:    • Smart Home Geräte & Gadgets – Tests, Setup...
Software & Services:    • Software & Services – Tools für Automatisi...

► Chapter markers:

00:00 - Intro
00:13 - What's it about?

00:27 - Card Mod Intro
01:29 - Installing Card Mod
02:01 - Adding to Configuration.yaml
02:21 - Locating Card Mod.js
04:35 - Preview
06:12 - Before/After Comparison
07:25 - Using Developer Tools
08:32 - Styling Cards Yourself
11:18 - Shadow Root Elements
12:44 - Classes and IDs
13:45 - Styling Cards
16:00 - Another Example
16:46 - Snippet Collection
20:58 - Conclusion
21:29 - Outro

► Don't forget to subscribe to the channel so you don't miss any of my new videos! Click the bell to be notified as soon as I release something new.

► Get ready to revolutionize your home and put your life on autopilot – here at "Everything Automatic"!

#HomeAssistant #ShadowDOM #CardMod