Clock Weather Card | Home Assistant | Page 1

ornate zealot Oct 2, 2024, 12:03 AM

#

I'm trying to alter th elook of the pkissling/clock-weather-card and overall I have it how I want, but I can't figure out how to change the color of the temperature ranges from the default green to red gradient. I see other dashboards online that have them set to different colors so I know it's possible. Not sure how what to add/change in the editor. Any insight is appreciated!

sonic tinsel Oct 2, 2024, 1:32 PM

#

can do it with cardmod

#

  style: |
    forecast-temperature-bar-range {
      background: linear-gradient(to right, blue, red) !important;
    }```

#

#

replace blue and red with desired setup

#

you can see what the variable names are in the style.ts file for the card which can be found here - https://github.com/pkissling/clock-weather-card/blob/master/src/styles.ts

#

for more gradient options can look here - https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/linear-gradient

ornate zealot Oct 3, 2024, 2:36 AM

#

thanks! this helped a lot including for future things - didn't think to look for a list of the styles on the github. Still a little new at putting all of the pieces together

#Clock Weather Card