Perhaps. It worked
1 Like
Can I change the font color of the primary and secondary text? Can I also make the icon “whiter” than this? I have card-mod installed.
Sorry if this had been asked before.
You can create an empty Mushroom card like this:
type: custom:mushroom-template-card
icon: none
icon_color: none
Or an invisible one like this:
type: custom:mushroom-template-card
icon: none
icon_color: none
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
card_mod:
style: |
ha-card {
--ha-card-background: none;
--ha-card-border-width: 0;
--ha-card-box-shadow: none;
}
1 Like
Also what theme are you using? Using the default theme mine looks like this:
using macOS theme looks like this:
both different than yours 
I would love you to share your entire setup because some stuff is hard to get how they work but again thanks and awesome work!
1 Like
Tested with default and Mushroom themes. I’ll have look tonight
1 Like
i use sensor.uptime just to fill the gap, but the idea its to grab for example your phone sensors.
Use type: custom:mushroom-title-card
Try copying again. It looks like you are missing some of the CSS.
Hi
I’m trying to change the color of the slider in the mushroom-fan-card with no luck. So obviously I’m doing something wrong.
- type: custom:mushroom-fan-card
entity: fan.mi_air_purifier_3_3h
icon_animation: true
icon_color: var(--rgb-indigo)
show_percentage_control: true
show_oscillate_control: false
collapsible_controls: false
card_mod:
style: |
ha-card {
border: 0px !important;
}
mushroom-shape-icon {
--icon-color: rgb(var(--rgb-indigo)) !important;
--shape-color: rgba(var(--rgb-indigo), 0.2) !important;
}
"mushroom-card .actions mushroom-fan-percentage-control$": |
mushroom-slider {
--main-color: rgb(var(--rgb-indigo)) !important;
--bg-color: rgba(var(--rgb-indigo), 0.2) !important;
}
Hi
I am having issues with this bit of code, this was done a waaaaay back. Basically I want two things out of this, 1) if the entity is “Home” then different colour and if the entity is “Away” then different colour. Also I just want this within the chip, is that possible?
Thank you
type: custom:mushroom-entity-card
entity: person.joe_bloggs
icon: mdi:face-man
name: JB
card_mod:
style:
mushroom-shape-icon$: |
.shape {
--shape-animation: ping 2s infinite;
}
@keyframes ping {
0% {
box-shadow: 0 0 5px 1px rgba(var(--rgb-blue), 0.7);
}
100% {
box-shadow: 0 0 5px 15px transparent;
}
}
Something like this?
type: custom:mushroom-template-card
entity: person.joe_bloggs
icon: mdi:face-man
icon_color: '{{ ''green'' if is_state(entity, ''home'') else ''blue'' }}'
primary: JB
card_mod:
style:
mushroom-shape-icon$: |
.shape {
--shape-animation: ping 2s infinite;
}
@keyframes ping {
0% {
box-shadow: 0 0 5px 1px var(--icon-color) inset;
}
100% {
box-shadow: 0 0 5px 15px transparent inset;
}
}
You can color the various elements like this.
Mushroom Element Colors:
type: custom:mushroom-template-card
primary: Mush
secondary: Rooms
icon: mdi:mushroom
card_mod:
style: |
mushroom-shape-icon {
--icon-color: white !important;
--shape-color: crimson !important;
}
ha-card {
--primary-text-color: tomato;
--secondary-text-color: maroon;
}
4 Likes
Thanks a million for helping me out! Worked perfectly! 
1 Like
It seems that this is working for the slider but I’m not sure how to change the icon color
- type: custom:mushroom-fan-card
entity: fan.mi_air_purifier_3_3h
icon_animation: true
icon_color: var(--rgb-indigo)
show_percentage_control: true
show_oscillate_control: false
collapsible_controls: false
card_mod:
style:
mushroom-card .actions mushroom-fan-percentage-control$: |
mushroom-slider {
--main-color: rgb(var(--rgb-indigo)) !important;
--bg-color: rgba(var(--rgb-indigo), 0.2) !important;
}
You are a star, Thank you
1 Like
Try like this:
type: custom:mushroom-fan-card
entity: fan.garage_fan
icon_animation: true
show_percentage_control: true
card_mod:
style: |
ha-card {
--rgb-state-fan: var(--rgb-pink);
}
1 Like
That works, perfect!
Thanks
2 Likes
Something odd with that theme … switched to iOs dark & light and looks similar to yours:
PS: is this the right place to ask questions about your card setup? I have a bunch and have tried to figure out things by myself but on some of them I am struggling 
Anyone have any input on how to change the icon color of just one chip based on state?
Minimalist Spotify Card for Home Assistant with Room Presence and Ambilight V2.0
Okay I have modified @rhysb card and created a complete new card. The animations are in a continous loop. When Spotift status turns into “idle” a welcome screen appears. Media players are listed at above.
Everything you need is in the manual. I have spent long hours writing the manual. There are definitions line by line for installing. Don’t worry if you are a newbee, it will be a piece of cake with the manual. You can even modify your own samples easily.
Enjoy…
Page Properties:
-
Minimalist Design. You can hide topbar or Spotify Card.
-
Room Presence. Start the music in your last entered room automatically.
-
Media Player controls
-
Spotify Card integrated. Start your playlist from the card.
-
Exclusively designed for Spotify control.
-
Ambilight animations.
-
Browser Mode integration.
-
Minimalistic design. You can hide media players and spotify playlist.
-
See which media player is currentlu playing
-
Rewind - Forward your music.
-
Developed on the basis of Amazon Echo devices but you can also use it with any other media player type.
-
Can easily be installed with the given manual
My Other Projects:
13 Likes