Cardmod Werte vergleichen => Icon einfärben

Hallo, ich habe mir schon im Internet einen Wolf gesucht. Ich würde gerne zwei Temperaturen vergleichen. So lange die Ist-Temperatur geringer als die Soll-Temperatur ist, soll das Symbol der Ist-Temperatur rot sein, wenn beide gleich sind, grün.

Mein Code sieht aktuell so aus (Tile Card)

type: tile
entity: sensor.backofen_temperatur
name:
type: entity
icon: mdi:temperature-celsius
vertical: false
features:
type: bar-gauge
features_position: bottom
card_mod:
style: |
  :host {
    -–paper-item-icon-color: [[[
      const ist = parseFloat(states[‚sensor.backofen_temperatur‘]?.state);
      const soll = parseFloat(states[‚sensor.backofen_solltemperatur‘]?.state);

      if (Number.isNaN(ist) || Number.isNaN(soll)) return 'var(--secondary-text-   color)';
      if (ist < soll) return 'red';
      if (ist === soll) return 'green';
      return 'var(--secondary-text-color)';
    ]]]
 }


Leider funktioniert es nicht. Könnte mir jemand weiterhelfen? @Osorkon :wink:

Hallo @megaMINDone mit card_mode kannst mich jagen. :dashing_away:
Da habe ich sowas von kein Plan von. :see_no_evil_monkey:

Bei einer Mushroom Template Karte, sieht es anders aus, da kann man mit den altbewährten Template yaml code arbeiten. :grinning_face:

Gruß Osorkon

Moin Moin,

Ahnung habe ich davon ehrlich gesagt auch nicht. Aber ich habs mal bei Gemini eingegeben. Folgendes kam dabei raus:

In Home Assistant nutzt card-mod die Jinja2-Templating-Engine, um Werte zu vergleichen. Damit kannst du das Aussehen deiner Karten (Farben, Icons, Sichtbarkeit) dynamisch an Zustände anpassen.

Hier sind die gängigsten Methoden, um Werte in card-mod zu vergleichen:

1. Einfacher Vergleich (String/Zustand)

Um zu prüfen, ob ein Sensor einen bestimmten Text-Zustand hat (z. B. „on“, „home“, „playing“):

YAML

card_mod:
  style: |
    ha-card {
      background: {% if is_state('sun.sun', 'above_horizon') %} lightyellow {% else %} midnightblue {% endif %};
    }

2. Numerischer Vergleich (Größer/Kleiner)

Da Zustände in Home Assistant standardmäßig als Text (String) gespeichert werden, musst du sie für mathematische Vergleiche mit | float oder | int umwandeln:

YAML

card_mod:
  style: |
    ha-card {
      --paper-item-icon-color: 
        {% if states('sensor.temperatur') | float > 25.0 %}
          red
        {% else %}
          blue
        {% endif %};
    }

3. Vergleich zwischen zwei Entitäten

Du kannst auch den Wert einer Entität direkt mit einer anderen vergleichen:

YAML

card_mod:
  style: |
    ha-card {
      border: {% if states('sensor.innen_temp') | float > states('sensor.aussen_temp') | float %}
                2px solid red
              {% else %}
                none
              {% endif %};
    }

4. Mehrere Bedingungen (elif)

Wenn du mehr als zwei Zustände unterscheiden möchtest:

YAML

card_mod:
  style: |
    ha-card {
      color: 
        {% set val = states('sensor.batterie') | int %}
        {% if val > 80 %} green
        {% elif val > 20 %} orange
        {% else %} red
        {% endif %};
    }

Wichtige Tipps:

  • config.entity: Wenn du card-mod direkt in einer Entitäten-Zeile nutzt, kannst du config.entity verwenden, um dich auf die aktuelle Entität zu beziehen, ohne die ID tippen zu müssen: states(config.entity).

  • Semikolon nicht vergessen: Achte darauf, dass das CSS-Semikolon (;) entweder im Template oder direkt dahinter steht, damit das CSS gültig bleibt.

  • Einheiten: Wenn dein Sensor Attribute wie Maßeinheiten hat, werden diese durch | float ignoriert, was den Vergleich sauberer macht.

Möchtest du ein konkretes Beispiel für eine bestimmte Karte (z. B. Mushroom, Tile oder Glance) erstellen?