Is there a way to use more color for gauge card?

Configuration Frontend
1

Hi,

in lovelace gauge car, we have for color (blue if not in the range) and green, yellow, red, for severity config.

i would like to know if there is a way to use other color ?
or, … use one color for two range like from 0 to 40 --> red, from 40 to 60 --> green, from 60 to 100 --> red

Regards,

1 Like
3

You can use every color you want with a theme.

2 Likes
4

thx,

i really need to check how we made theme.
i just make the update to lovelace, so i’m in “discovery mode” hahahah

Regards

5

For anyone that comes looking, this changed at some point (apparently without documentation). Here is what works for me now:

gauge:
  ha-card-background: "rgba(70, 70, 70, 0.1)"
  success-color: '#008ae6'
  warning-color: '#EA8016'
  error-color: '#c3423f'
3 Likes
6

Were you able to change the main color or just the 3 severity numbers?

7

The background will change with that first line; I haven’t looked into changing the needle or text colors but you can examine the elements using your browser inspector

8

Thanks a ton @fmon - I was scratching my head with this until I came upon your post.

Just a minor correction (unsure if it’s changed since you posted this). The main colour, or the one used when severity is disabled, is actually info-color. For example:

#config/themes/gauge_theme.yaml

Gauge Theme:
  info-color: "#008ae6"
  success-color: '#80C884'
  warning-color: '#EA8016'
  error-color: '#c3423f'
3 Likes