Pompom
30. Dezember 2025 um 12:26
74
So sollte es gehen, nicht so schnell aufgeben.
- entity: sensor.ruckschlagklappe
name: Rückschlagklappe
card_mod:
style: |
:host {
--primary-text-color: {{ 'orange' if states(config.entity) | int >= 44 else 'var(--primary-text-color)' }};
}
@Pompom : leider funktioniert es damit auch nicht (im Editor dreht sich da nur der Kreisel). Mit folgendem Code habe ich es jetzt immerhin hinbekommen, dass der Text der Entität UND der Zahlenwert farbig werden. Ich hätte es aber gerne so, dass nur der Zahlenwert farbig sind. Ist bestimmt nur noch eine kleine Änderung, aber ich komme nicht drauf, was ich ändern muss…
- entity: sensor.ruckschlagklappe
card_mod:
style: |
hui-generic-entity-row:
$: |
.text-content:not(.info) {
color:
{% if states(config.entity) | int <= 35 %}
green
{% elif states(config.entity) | int <= 37 %}
greenyellow
{% elif states(config.entity) | int <= 40 %}
yellow
{% elif states(config.entity) | int <= 50 %}
orange
{% elif states(config.entity) | int >= 50 %}
red
{% endif %}
;
}
Mit folgendem Code wird der Zahlenwert ab 44 Grad orange, aber ich würde es gerne noch weiter abstufen:
- entity: sensor.ruckschlagklappe
name: Rückschlagklappe
card_mod:
style:
hui-generic-entity-row:
$: |
.text-content:not(.info) {
color: {% if states(config.entity) | int >= 44 %} orange {% endif %}
;
}
Pompom
30. Dezember 2025 um 14:40
76
- entity: sensor.ruckschlagklappe
name: Rückschlagklappe
card_mod:
style:
hui-generic-entity-row:
$: |
.state {
color:
{% set val = states(config.entity) | int(0) %}
{% if val >= 60 %} red
{% elif val >= 44 %} orange
{% else %} inherit
{% endif %};
}
Noch nicht getestet aber sollte funktionieren.
@Pompom : ich getraue es mir gar nicht zu sagen, aber wenn ich das einkopiere, dann dreht sich erneut nur der Kreisel.
EDIT: es lag an falschen Einrückungen. Nachdem ich diese korrigiert habe, funktioniert es nun einwandfrei.
Ganz herzlichen Dank für Deine unendliche Geduld!
Dann vermute ich mal, dass Du bei der Einrückung was falsch hast. YAML ist mega zickig, wenn nicht alles genau eingerückt ist im Code.
Kannst Du hier vielleicht den gesamten Code mal posten?
Hast es ja noch selbst gemerkt!!!
@RobertoCravallo : danke, hat sich erledigt (siehe mein “EDIT” oben)!
Das war eine schwere Geburt!
Aber danke an Euch, dass Ihr Euch so viel Mühe mit mir gegeben habt! An dieser Stelle Euch allen einen guten Rutsch ins neue Jahr!
1 „Gefällt mir“
Wer kann mir mit folgendem Problem helfen?
Ich möchte in einer Karte nur den Zustand einer Entität “Fenster Arbeitszimmer” mit eine Zustands-Änderung rot = offen, grün = geschlossen anzeigen. Mit dem folgenden Code wird mir allerdings leider jedes Icon grün eingefärbt, wobei die übrigen Entitäten auch bei einer Zustandsänderung immer grün bleiben.
Für die übrigen Entitäten sollen die Standard-Einstellung von Homeassistant weiterhin gelten.
Der Code sieht wie folgt aus:
Code als Bild ist ungünstig/sch… . Ich tippe jetzt nicht den ganzen Code ab. Aber ich würde mal Card_mod unter die gewünschte Entität einrücken.
card_mod:
style: |
/* Hintergrundfarbe der Karte */
ha-card {
--ha-card-background: black;
color: var(--primary-color);
}
:host {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
--card-mod-icon-color: red
{% elif is_state('binary_sensor.fenster_arbeitszimmer', 'off') %}
--card-mod-icon-color: green
{% endif %}
}
type: entities
entities:
- entity: switch.arbeitszimmer_dg
- entity: binary_sensor.fenster_arbeitszimmer
- entity: binary_sensor.bat_stat_arbeitszimmer
- entity: switch.arbeitszimmer_steckdose_desk
icon: mdi:power-socket-de
show_header_toggle: false
state_color: true
title: Arbeitszimmer DG
Sorry, lieber sirector - habe nicht darüber nachgedacht. Da hast Du vollkommen recht. Allerdings war es gestern/ heute morgen schon sehr spät😄
Habe mich erst vor 2 Tagen mit card-mod angefangen zu beschäftigen und hatte es so verstanden, dass card-mod immer zu Beginn (ganz oben) in den Code eingebunden werden soll.
Am liebsten wäre mir allerdings wenn ich diese Anpassung über eine *.yaml hinbekommen würde. Da habe ich mich allerdings bisher vergeblich dran bemüht. Alles was ich bisher in eine card-mod-themes.yaml gepackt hatte funktionierte nicht.
In meiner Verzweiflung hatte ich auch chat gpt bemüht, aber das Teil ist hier leider noch nicht so weit trainiert, als dass da etwas brauchbares dabei herauskommt.
Pompom
31. Dezember 2025 um 18:53
85
Probiere mal so
type: entities
title: Arbeitszimmer DG
show_header_toggle: false
state_color: true
entities:
- entity: switch.arbeitszimmer_dg
- entity: binary_sensor.fenster_arbeitszimmer
card_mod:
style:
hui-generic-entity-row:
$: |
state-badge {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
--paper-item-icon-color: red !important;
{% else %}
color: green !important;
--paper-item-icon-color: green !important;
{% endif %}
}
.info {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
{% else %}
color: green !important;
{% endif %}
}
- entity: binary_sensor.bat_stat_arbeitszimmer
- entity: switch.arbeitszimmer_steckdose_desk
icon: mdi:power-socket-de
Falls du die Schriftfarbe nicht möchtest nim den Part
.info {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
{% else %}
color: green !important;
{% endif %}
}
raus.
Guten rutsch.
Hallo lieber pompom,
vielen Dank das war die Lösung
Ich wünsche Dir und auch allen anderen hier ein glückliches, gesundes neues Jahr!
Ich habe es jetzt so eingebaut:
type: entities
title: Arbeitszimmer DG
show_header_toggle: false
state_color: true
card_mod:
style: |
/* Hintergrundfarbe der Karte */
ha-card {
--ha-card-background: silver;
color: var(--primary-color);
}
entities:
- entity: switch.arbeitszimmer_dg
- entity: binary_sensor.fenster_arbeitszimmer
card_mod:
style:
hui-generic-entity-row:
$: |
state-badge {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
--paper-item-icon-color: red !important;
{% else %}
color: green !important;
--paper-item-icon-color: green !important;
{% endif %}
}
.info {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
{% else %}
color: green !important;
{% endif %}
}
- entity: binary_sensor.bat_stat_arbeitszimmer
- entity: switch.arbeitszimmer_steckdose_desk
icon: mdi:power-socket-de
Könntest Du mir bitte jetzt noch einen Tip geben, wie die Farbe der
Kartenüberschrift “Arbeitszimmer” angepasst werden kann?
Gibt es so etwas wie eine Header-color Kommando o. ä.?
Verflixt, jetzt habe ich gerade bemerkt, dass das Icon noch in der Standardfarbe leuchtet,
was ist denn da verrutscht?:
Pompom
1. Januar 2026 um 14:48
87
type: entities
title: Arbeitszimmer DG
show_header_toggle: false
state_color: true
entities:
- entity: switch.arbeitszimmer_dg
- entity: binary_sensor.fenster_arbeitszimmer
card_mod:
style:
hui-generic-entity-row:
$: |
state-badge {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
--paper-item-icon-color: red !important;
{% else %}
color: green !important;
--paper-item-icon-color: green !important;
{% endif %}
}
.info {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
{% else %}
color: green !important;
{% endif %}
}
- entity: binary_sensor.bat_stat_arbeitszimmer
- entity: switch.arbeitszimmer_steckdose_desk
icon: mdi:power-socket-de
card_mod:
style: |
/* Überschrift der Karte */
.card-header {
color: #FF5733 !important; /* Hier deine Farbe einfügen */
font-weight: bold; /* Optional: Fett gedruckt */
}
/* Hintergrundfarbe der Karte */
ha-card {
--ha-card-background: silver;
color: var(--primary-color);
}
So sollte es gehen.
super, tausend Dank das funktioniert prima.
jetzt wäre nur noch das Problem mit der Standard Iconfarbe beim Zustand geöffnet noch offen.
Habe schon gefühlte tausend Versionen ausprobiert
Tschaka, jetzt habe ich die Lösung:
type: entities
title: Arbeitszimmer DG
show_header_toggle: false
state_color: true
entities:
- entity: switch.arbeitszimmer_dg
- entity: binary_sensor.fenster_arbeitszimmer
state_color: false
card_mod:
style:
hui-generic-entity-row:
$: |
ha-icon,
ha-state-icon,
state-badge,
.info,
.text-content {
{% if is_state('binary_sensor.fenster_arbeitszimmer', 'on') %}
color: red !important;
--state-badge-color: red !important;
--state-color: red !important;
{% else %}
color: green !important;
--state-badge-color: green !important;
--state-color: green !important;
{% endif %}
}
- entity: binary_sensor.bat_stat_arbeitszimmer
- entity: switch.arbeitszimmer_steckdose_desk
icon: mdi:power-socket-de
card_mod:
style: |
/* Hintergrundfarbe der Karte */
ha-card {
--ha-card-background: silver;
color: var(--primary-color);
}
/* Überschrift der Karte */
.card-header {
color: green !important; /* Hier deine Farbe einfügen */
font-weight: bold; /* Optional: Fett gedruckt */
}
Zuerst mal wünsche ich Euch allen ein gesundes, neues Jahr!
… und dann komme ich auch schon wieder mit einer neuen Herausforderung ums Eck!
Ich habe derzeit folgende Stapel-Karte für mein Raumklima:
Hier der Code:
type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: sensor.wetterstation_indoor_temperature
name: Wohnzimmer
icon_color: primary
- type: custom:mushroom-entity-card
entity: sensor.wetterstation_indoor_humidity
name: Wohnzimmer
icon_color: primary
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
name: Micha
icon_color: primary
entity: sensor.shellyhtg3_8cbfeaa5c400_temperature
- type: custom:mushroom-entity-card
entity: sensor.shellyhtg3_8cbfeaa5c400_humidity
name: Micha
icon_color: primary
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
name: Manu
icon_color: primary
entity: sensor.shelly_thermometer_manu_temperature
- type: custom:mushroom-entity-card
entity: sensor.shelly_thermometer_manu_humidity
name: Manu
icon_color: primary
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: sensor.shelly_thermometer_bad_temperature
name: Bad
icon_color: primary
- type: custom:mushroom-entity-card
entity: sensor.shelly_thermometer_bad_humidity
name: Bad
icon_color: primary
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: sensor.shelly_thermometer_buro_temperature
name: Büro
icon_color: primary
- type: custom:mushroom-entity-card
entity: sensor.shelly_thermometer_buro_humidity
name: Büro
icon_color: primary
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
icon_color: primary
entity: sensor.shellyhtg3_8cbfeaa4b6e0_temperature
name: Vorratsraum
- type: custom:mushroom-entity-card
name: Vorratsraum
icon_color: primary
entity: sensor.shellyhtg3_8cbfeaa4b6e0_humidity
title: Raumklima
Ist es auch hier möglich, dass man die Temperatur- und Feuchtigkeitswerte abhängig von den Schwellwerten unterschiedlich einfärbt?
Pompom
2. Januar 2026 um 15:44
91
Ja, musst halt für jede entity eine Abfrage erstellen!
This topic is technically a cross post from a reply to the Mushroom Card Topic found here: Part 1. But it was suggested in a comment to post it here as a guide instead. Below info is true as of Mushroom Version 4.4.0 and Card Mod Version 3.4.4 ...
Reading time: 365 mins 🕑
Likes: 966 ❤
Hallo in die Runde und allen ein gesundes und erfolgreiches neues Jahr.
Ich bin erst seit 2 Wochen in Besitz eines Home Assistent und hatte eigentlich gehofft es wenigstens ansatzweise verstanden zu haben. Auf „normalen“ Karten funktionieren meine Card-Mod -Eingaben auch sehr gut. Nur in den Eintitäts-Filter-Karten habe ich Probleme.
Nun zu meinem Problem und ich hoffe, dass ihr mir weiterhelfen könnt.
Ich habe zwei Entitäts-Filter-Karten um mir anzeigen zu lassen welche Innenrollos (alle vom Typ: shade) geöffnet bzw. geschlossen sind.
Nun möchte ich:
Bei jeder Entität die aktuelle Position als Sekundäre Info angezeigt bekommen:
Füge ich aber (wie ich es erwartet hätte) secondary_info: current_position bei der jeweiligen Entität ein, passiert einfach gar nichts.
Die Symbole in grün (auf der Filter-Karte offen) bzw. dunkelblau (auf der Filter-Karte geschlossen) darstellen:
Füge ich aber --card-mod-icon-color: green; im Abschnitt :host ein, so werden auch die Steuer-Icons in grün dargestellt (was ich auf gar keinen Fall möchte). Und unter :ha-icon passiert nichts.
Hier mein derzeitiger Code für eine der beiden Karten. Wie gesagt funktionieren secondary_info und –card-mod-icon-color derzeit nicht.
type: entity-filter
entities:
- entity: cover.rollerblind_0002
name: Balkontür
secondary_info: current_position
- entity: cover.rollerblind_0001
name: Wohnzimmerfenster
- entity: cover.rollerblind_0003
name: Küche
- entity: cover.rollerblind_0004
name: Schlafzimmer groß
- entity: cover.rollerblind_0005
name: Schlafzimmer klein
- entity: cover.rollerblind_0006
name: Spielzimmer
conditions:
- condition: state
state: open
card:
type: entities
state_color: true
card_mod:
style: |
:host {
--card-mod-icon: mdi:blinds-open;
}
:ha-icon {
--card-mod-icon-color: green;
}
Könnt ihr mir weiterhelfen und mir verraten wo hier meine Fehler liegen bzw. falls ich es hier (trotz mehrtätigem suchen ) überlesen habe den entsprechenden link geben?
Vielen Dank schonmal im Vorraus.
Pompom
3. Januar 2026 um 09:37
93
Schau dir das an dann bekommst du es raus.
https://community.simon42.com/t/card-mod-icon-farbe-anhand-von-zustands-wert-aendern/8390/88?u=pompom
Du must jeder Entity welche du verändern willst einen card_mod mitgeben