Dev Tools -> Services -> frontend.reload_themes ?
OK … went to ‘Dev Tools -> Services -> frontend.reload_themes’ and I didnt type anything in ‘Service Data (YAML, optional)’ just click on button ‘call service’ … but same result as before
What’s in your configuration.yaml,
frontend:
themes: ???
frontend:
themes: !include_dir_merge_named ./themes
No sure if that ./ at the front will work.
If your themes.yaml is not in that themes folder, HA will not read it.
I have this
frontend:
themes: !include_dir_merge_named themes
and created a file gauges.yaml (name doesnt matter) in it.
th_gauge_3:
label-badge-blue: "#55acee"
label-badge-green: "#9bc53d"
label-badge-yellow: "#fde74c"
label-badge-red: "#c3423f"
Save -> frontend.reload_themes
I created in /config/themes/gauge.yaml following:
gauge:
label-badge-blue: "#55acee"
label-badge-green: "#9bc53d"
label-badge-yellow: "#fde74c"
label-badge-red: "#c3423f"
My /config/configuration.yaml has:
frontend:
themes: !include_dir_merge_named themes
/config/themes.yaml is emty.
Now I can choose theme ‘gauge’ in edit-gauge-card but how do get the new colors.
It looks strange …
entity: sensor.temperature_14
max: 40
min: -5
name: Ute
severity:
label-badge-blue: 1
label-badge-green: 5
label-badge-yellow: 15
label-badge-red: 25
green: .nan
yellow: .nan
red: .nan
theme: gauge
type: gauge
I have a theme that I use already (Dark-Green) where a section have following …
label-badge-red: "#D06568"
label-badge-green: "#80C884"
label-badge-blue: "#5F9BEA"
label-badge-yellow: "#DFC271"
label-badge-gray: "#5F6267"
can’t I just that Dark-Green theme?
What I did was to define a Gauge Card and in the code editor added following:
entity: sensor.temperature_14
max: 100
min: 0
name: ute
severity:
green: 10
red: 25
yellow: 15
blue: 28
theme: Dark-Green
type: gauge
still can’t get the colors right … the visual editor only shows ‘green/yellow/red’
Well, that’s how the core gauge works.
Something to read:
I followed your guidelines … but I missed something
I have a theme ‘Dark-Green’ … where I have defined the colors
label-badge-red: "#ed6165"
label-badge-green: "#80C884"
label-badge-blue: "#aecdf5"
label-badge-yellow: "#DFC271"
label-badge-white: "#FFFFFF"
Then I made the hack in ‘gauge-card.js’
Get an error ‘Failed to execute ‘attachShadow’ on ‘Element’: Shadow root cannot be created on a host which already hosts a shadow tree.’
Here is my code for that card:
entity: sensor.temperature_14
theme: Dark-Green
title: xxx
max: 35
min: -20
severity:
white: -10
blue: 0
green: 10
yellow: 20
red: 30
type: 'custom:gauge-card'
I tried this, and it isn’t working for me. I don’t have a separate themes.yaml file, but I created one in the themes directory that I made. (/config/themes/themes.yaml).
In /config/themes/themes.yaml, I have the following:
theme_gauge_temperature:
label-badge-blue: "#0000ff" # Dark Blue
label-badge-green: "#33ccff" # Light Blue
label-badge-yellow: "#33cc33" # Green
label-badge-red: "#ff0000" # Red
In my configuration.yaml file, I have
frontend:
extra_module_url:
- /local/community/custom-brand-icons/custom-brand-icons.js
themes: !include_dir_merge_named themes
I can pull up the theme using the UI. Here is a screenshot of what I get:
Here’s the code:
type: gauge
entity: sensor.front_door_temperature_2
min: 0
max: 100
name: Front Door
theme: theme_gauge_temperature
severity:
green: 0
yellow: 68
red: 73
I have checked my configuration, restarted home assistant, emptied my caches, and restarted my browser many times.
Thanks in advance for your help!
