Changement couleur temperature

Bonjour

J’aimerais changer la couleur de fond de ma card suivant la température.
J’ai donc créer un button card mais je ne comprend pas pk la couleur ne change pas avec le code que j’ai mis
Je suis débutant en code donc soyez indulgent
Merci


type: custom:button-card
name: salon
entity: sensor.lumi_lumi_weather_temperature
title: test
show_units: true
show_state: true
styles:
  card:
    - filter: opacity(70%)
    - height: 100px
  name:
    - font-size: 14px
    - color: red
  state:
    - value: 0
      operator: '<'
      styles:
        card:
          - background-color: blue
          - filter: opacity(100%)
          - height: 100px
    - value: 10
      operator: '>='
      styles:
        card:
          - background-color: yellow
          - filter: opacity(100%)
          - height: 100px
    - value: 20
      operator: '>='
      styles:
        card:
          - background-color: green
          - filter: opacity(100%)
          - height: 100px

Bonjour

Pour changer la couleur du background j’ai utilisé ce code.

    - background-color: |
        [[[
          if (states['sensor.outside_temp'].state <20)
           return 'blue'; if (states['sensor.outside_temp'].state <25)
           return 'green'; if (states['sensor.outside_temp'].state <30)
           return 'violet'; return 'orange'   
        ]]]

Ce qui donne cela (en orange)

Je peux te poster le code complet si tu préfère.

Merci c’est ce que je veut
Et oui pour le code
Merci

Voilà mon code complet.
Il faut adapter à ton besoin et utiliser tes entités.

type: custom:button-card
entity: sensor.outside_temp
name: Temperature Exterieur
aspect_ratio: 3/1
tap_action:
  action: null
show_state: true
show_last_changed: false
styles:
  card:
    - background-color: |
        [[[
          if (states['sensor.outside_temp'].state <20)
           return 'blue'; if (states['sensor.outside_temp'].state <25)
           return 'green'; if (states['sensor.outside_temp'].state <30)
           return 'violet'; return 'orange'   
        ]]]
    - border-radius: 10%
    - filter: opacity(70%)
    - padding: 2px
    - text-transform: null
    - font-size: 11px
    - border: |
        [[[
          if (states['sensor.outside_temp'].state <20)
           return '2px solid blue'; if (states['sensor.outside_temp'].state <25)
           return '2px solid green'; if (states['sensor.outside_temp'].state <30)
           return '2px solid violet'; return '2px solid orange'   
        ]]]
  icon:
    - color: |
        [[[
          if (states['sensor.outside_temp'].state <20)
           return 'blue'; if (states['sensor.outside_temp'].state <25)
           return 'green'; if (states['sensor.outside_temp'].state <30)
           return 'violet'; return 'orange'