Mushroom Cards - Build a beautiful dashboard easily 🍄 (Part 1)

Hi all,

Can someone help me to set the icon color of the Mushroom template card based on temperature value?

Something like:
Normal color = blue < 15°C
If temperature sensor is > 15°C then orange color
if temperature sensor is > 25°C then red color

Here’s an example of what I use in a mushroom template card

            icon_color: >-
              {% if (state_attr('sensor.john','direction_of_travel') == 'stationary') and (states('device_tracker.sm_f926u1') == 'home') %} green
              {% elif (state_attr('sensor.john','direction_of_travel') == 'stationary') and (states('device_tracker.sm_f926u1') == 'not_home') %} blue
              {% else %} cyan
              {% endif %}

You can modify that to work for you :slight_smile:

2 Likes

Any idea why I can’t get the Stackin card to work? I installed it through HACS I cleared my cache restarted Home Assistant like I do every time I add something and this isn’t showing up. Is there a prerequisite that I need before this works?

Could you expand on what you mean by “this isn’t showing up”? Does it say it’s not loaded in HACS? Could you send a screenshot of any relevant error messages?

It shows it’s installed in HACS. But when I go to add card, I cannot find this custom stack in card. Only the horizontal and vertical

It’s not configurable in the UI.

What does that mean? I tried manually typign in type: ‘custom:stack-in-card’ and i get

Configuration errors detected:

  • Custom element not found: stack-in-car

Keep typing and adding configuration, the error will go away.

1 Like

So it’w normal that I dont see it listed under “add card”

Yes. It’s documented as being that way.

AH well apparently I should learn how to read then lol I got it working. Thank you

Actually Could I ask you one more that I haven’t been able to get an answer to? Ever since updating mushroom tp use climate card. This is what I get. But I’d I pull down on my phone or refresh I. My browser it works. And looks perfect . But every once and a while I get this error again and have to pull to refresh.

I’ve updated hole assistant since then I’ve cleared cache restarted etc.

Not sure what causes that to happen, maybe someone else would know. It’s happened to me sometimes too.

Yea definitely here you go!

type: custom:vertical-stack-in-card
cards:
  - type: custom:mushroom-template-card
    primary: Front Door
    secondary: >-
      {% if is_state('lock.front_door','unlocked') and
      is_state('binary_sensor.front_door_alarm_sensor','on') %}
        Open and Unlocked
      {% elif is_state('binary_sensor.front_door_alarm_sensor','on') %}
        Door Open
      {% elif is_state('lock.front_door','unlocked') %}
        Unlocked
      {% else %}
        Locked
      {% endif%}
    icon: >-
      {% if is_state('lock.front_door','unlocked') and
      is_state('binary_sensor.front_door_alarm_sensor','on') %}
        mdi:door-open
      {% elif is_state('binary_sensor.front_door_alarm_sensor','on') %}
        mdi:door-open
      {% elif is_state('lock.front_door','unlocked') %}
        mdi:lock-open
      {% else %}
        mdi:lock
      {% endif%}
    layout: vertical
    icon_color: >-
      {% if is_state('lock.front_door','locked') and
      is_state('binary_sensor.front_door_alarm_sensor','off') %}
        green
      {% else %}
        red
      {% endif%}
    badge_icon: >-
      {% set battery_level = (states('sensor.front_door_battery') | int / 10) |
      round(0) | int * 10 %} {% if battery_level < 20 %}
        mdi:battery-{{ battery_level }}
      {% elif battery_level < 5 %}
        mdi:battery-alert-variant-outline
      {% else %} {% endif %}
    badge_color: |-
      {% set battery_level = states('sensor.front_door_battery') %}
      {% if battery_level < '20' %}
        orange
      {% elif battery_level < '5' %}
        red
      {% else %}
      {% endif %}
    tap_action:
      action: none
    card_mod:
      style: |
        ha-card {
          background: none;
          box-shadow: none;
        }
  - type: custom:mushroom-lock-card
    entity: lock.front_door
    name: Laundry Room Door
    primary_info: none
    secondary_info: none
    icon_type: none
    layout: vertical
    card_mod:
      style: |
        ha-card {
          background: none;
          box-shadow: none;
        }
card_mod:
  style: |
    ha-card {
      {% if is_state('lock.front_door','locked') and
      is_state('binary_sensor.front_door_alarm_sensor','off') %}
          background: rgba(101,170,91,0.1);
      {% else %}
          background: rgba(226,84,66,0.1);
      {% endif %}
    }

4 Likes

Thanks, but I do not see the logics to use it with a temperature sensor.
I now configured below:

icon_color: >-
      {% if (state_attr('sensor.woonkamer_temperature','temperature') == '> 15') %} green
      {% elif (state_attr('sensor.woonkamer_temperature','temperature') == '> 20') %} blue
      {% else %} cyan
      {% endif %}

The temp sensor right now shows 27.8°C but the color stays cyan.

1 Like
== '> 20'

is improper syntax. You probably want something like > 20. I think you might be looking for the state, not an attribute, so you might also want to change the state_attr part too.

2 Likes

Oke I am messing around for hours but can’t get it to work :frowning:

Maybe it is not possible @ all?

Remove the ==.

2 Likes

Try adding | int after the ) of the states function.

2 Likes