Check with Development tools-> Templates, what is shows for your expression?
like I said, it is true or false
Cannot check it by myself - but could you rewrite it:
if () “true” else “false”
yes, I did all that, used al kinds of formats in the config-template card. Even used a plain input_boolen.test to see if the state would change, but I couldn’t make it happen.
Meanwhile Ive concocted this:
- type: custom:state-switch
entity: template
template: >
{{states('input_select.theme')|regex_search('(ight|Dark|Matrix)')}}
states:
true:
<<: &config
type: custom:auto-entities
show_empty: false
filter:
include:
- domain: person
not:
state: home
card:
dark_mode: true
<<: &map_not_home
type: map
hours_to_show: 48
card_mod:
style: |
ha-card {
box-shadow: none;
}
false:
<<: *config
card:
dark_mode: false
<<: *map_not_home
and that seems to do the trick. Where would we be without Anchors and the cards by Thomas…
Great, thanks for your help! Thanks for explaining how to combine the ha-card with long DOM paths. 
I was able to combine the code and let the icon be at full brightness even though they are dimmed. The reason for the code-block with the specified height, width and flex is to make the multiple-entity-row entities more compact (less margin between the icons), which seems to be working okay.
Again, thanks for your help!
Anyone here that uses Scheduler-Card and has modded the button/track colors?
Through inspect element I have found this"
And changing this code to yellow seems to work.
Button
Track
But I’m having a difficult time converting this to something I can use in card_mod. Anyone care to help?
Hi thanks Idar, I took a look at your example. I tried to ‘translate’ that onto scheduler card, but it doesn’t seem to work. If I look at inspect elements screenshot, the style should be like this?
card_mod:
style:
scheduler-entities-card:
$:
ha-card:
$:
scheduler-entity-row:
$:
ha-switch:
$: |
.mdc-switch .mdc-switch__track {
border-color: green !important;
}
.: |
ha-switch {
--switch-unchecked-track-color: yellow;
--switch-checked-track-color: red;
}
Try this (not tested):
card_mod:
style:
scheduler-entity-row:
$:
ha-switch:
$: |
...
I’d like to override the fold-entity-row fold icon, which works with the following code, but only until the button is clicked. It reverts to the expected icon again on refresh.
type: custom:fold-entity-row
card_mod:
style:
ha-icon:
.: |
ha-icon {
--card-mod-icon: mdi:plus-circle-outline;
}
head:
entity: cover.blinds
card_mod:
style:
hui-generic-entity-row$: |
state-badge {
display: none
}
div {
font-size: 1.5em;
font-weight: bold;
padding-left: 0px;
float: left;
}
entities:
- entity: cover.north_blind
name: North Blind
- entity: cover.south_blind
name: South Blind
Any ideas? I’ve seen a few instances of the --card-mod-icon being described as working partially, so I wonder if this is one of those instances, but it could easily be something I’m missing. Even with the amazing examples in this thread it’s still slow going with my weak CSS skills.
Wonder if anyone can help with modifying a picture-glance card. I want to remove the gray overlay that comes down halfway across our faces, or just make it smaller so it only covers the bottom thrid of the image.
The following code bit is for the first image.
type: grid
cards:
- type: picture-glance
image: /local/myImage.png
entity: person.me
show_state: true
state_filter:
home: brightness(110%) saturate(1.2)
not_home: brightness(110%) saturate(0)
School: brightness(110%) saturate(0)
Work: brightness(110%) saturate(0)
entities:
- entity: sensor.my_phone_battery_level
icon: none
- entity: person.me
icon: none
- type: picture-glance
...
...
Thanks in advance
This should work:
type: grid
cards:
- type: picture-glance
style: |
ha-card .box {
background-color: rgba(0,0,0,0);
}
image: /local/myImage.png
entity: person.me
show_state: true
state_filter:
home: brightness(110%) saturate(1.2)
not_home: brightness(110%) saturate(0)
School: brightness(110%) saturate(0)
Work: brightness(110%) saturate(0)
entities:
- entity: sensor.my_phone_battery_level
icon: none
- entity: person.me
icon: none
- type: picture-glance
...
...
if you want that in your full config, why not simply hack the resource:
icon=${this.open?"mdi:chevron-up":"mdi:chevron-down"}
seems easy enough to edit…
- type: custom:config-template-card
entities:
- input_select.theme
variables:
dark-mode: states['input_select.theme'].state.includes(['ight','Dark','Matrix'])
card:
type: custom:auto-entities
show_empty: false
filter:
include:
- domain: person
not:
state: home
card:
type: map
hours_to_show: 48
dark_mode: '${dark-mode}'
card_mod:
style: |
ha-card {
box-shadow: none;
}
but I get an error about an unexpected ‘-’…
do you see the obvious issue?
edit
nvm, that was because the variable has a -. changing made the error disappear. However, the mode isnt set correctly, so I guess the template isnt correct. also because
states['input_select.theme'].state.includes('Dark')
does work!
Ill move this to a topic regarding the config-template-card.
Thanks Idar, that worked great. I also managed to mod a header part of the card. The icons in the card I’m having troubles with, but I’m gonna try more. I’m beginning to understand the structure more with your examples and the explanation of shadowroot on the docs 
1 Like
@olympia, if you are still interested in transparent background for numberbox-card, check the updated post.
You’re really helpful @Ildar_Gabdullin!
I removed my post, because I figured it out in the meantime and thought you didn’t look at it yet.
However, you generated a really helpful addition to your post! Thank you for this!
In my case, I also had to add
box-shadow: none;
as well to the entities card, because I had it within a custom:button-card and the shadow was visible even without having the background.
Many thanks again for looking into this!
Hi guys, I have a badge-card, is it possible to change the color of the badge? If it’s possible…
sensor.alarm_last_motion
- type: custom:badge-card
badges:
- entity: sensor.paradox_battery_voltage
name: Batteria
- entity: sensor.paradox_panel_voltage
name: Alimentazione
- entity: sensor.run_status
name: Centrale
Thanks
1st post → link at the bottom → consolidated post → styles for badges
Great thanks!