Text color in tile card with background color in dark mode?

Configuration Frontend
1

Hello, I have a problem with the color of the text in tile cards when in dark mode.

I use the tile card together with the condition card to create an information dashboard.
I show the cards in defined conditions and set the background color according to the current condition using card-mod. Like this:

  # Innenlicht
  - type: conditional
    conditions:
      - entity: binary_sensor.lichter_innen
        state: 'on'
    card:
      type: tile
      # type: entity
      name: Innen
      entity: binary_sensor.lichter_innen
      attribute: an
      unit: an
      state_color: true
      card_mod:
          style: |
            ha-card {
              color: black;
              box-shadow: none;
              background:
              {% if is_state('binary_sensor.lichter_innen', 'on') %}
                lightyellow
              {% else %} 
                
              {% endif %} ;
            }
      double_tap_action:
        action: navigate
        navigation_path: /lovelace-yaml/lights
      tap_action:
        action: fire-dom-event
        browser_mod:
          service: browser_mod.popup
          data:
            browser_id: THIS
            timeout: 30000
            title: Licht
            content:
                type: custom:auto-entities
                card:
                  title: Innenlicht
                  type: entities
                  state_color: true
                filter:
                  include:
                    - domain: light
                      state: 'on'
                  exclude: []
                sort:
                  method: friendly_name
                show_empty: false
                timeout: 36000
                right_button_action:
                  service: browser_mod.navigate
                  data:
                    path: /lovelace-yaml/lights
                left_button_action:
                  service: script.alle_lichter_aus
                  data: {}

that looks fine in light mode because the text color is black but in dark mode the text color changes to white. That makes it hardly readable when the backgroundcolor of the tile ist eg. yellow or orange.
I tried to modify the “color”, but that has no effect.

What can i do?

2

change color: black to --primary-text-color: black !important; and you should be good to go.

1 Like