I tried several times to install and activate CustomUi, but always unsuccesfully.I followed the docs step by step but never saw a change in my UI. I run HASS on Hassbian. My question is: is CustomUi compatible with hassbian or not as my doubt is this…
Hi Vlad,
I would like to know how you have configured the color of the text to transform in green. Could you share the code?
Thank you.
Use: New CustomUI release
Install, configure.
Define:
themes:
green:
primary-text-color: ‘#008000’
red:
primary-text-color: ‘#ff0000’
In customize.yaml example:
sensor.speedtest_ping:
custom_ui_state_card: state-card-custom-ui
icon: mdi:speedometer
friendly_name: Ping
templates:
theme: “if (state == ‘unknown’) return ‘red’; else return ‘green’;”
@andrey The problem is that hs_color does not accurately map to rgb_color. We also need to add brightness. Here’s what I am using currently:
sensor.*_futures_change_pct:
templates:
hs_color: >
if (state < -4) return [360, 85];
if (state < -2) return [23, 90];
if (state < 0) return [50,100];
if (state < 2) return [65,85];
if (state < 4) return [100,65];
return [150,95];
brightness: >
if (state < -4) return 216;
if (state < -2) return 255;
if (state < 0) return 255;
if (state < 2) return 220;
if (state < 4) return 192;
return 153;
I used the following to obtain the colors (converted RGB into Hue, sat, brightness using http://colorizer.org/ and scaled the brightness to 0-255 based on @NovapaX suggestion)
First, it is definitely less elegant than using rgb_color. More importantly, the colors are not accurately rendered. Here’s the output:

The color is #E1F224, which is equivalent to HSB values of 64.95, 85.12, and 94.9 (or a scaled value of 241.995).
Hello,
I need some tabs and/or groups to be hidden for all device except a few, I cannot figure out how to make it work:
homeassistant:
customize:
group.tab_settings:
order: 10
hidden: true
customize_glob:
group.tab_settings:
device:
"*.*":
hidden: true
mydevice:
hidden: false
group:
default_view:
view: yes
entities:
- group.infos
- group.family
- group.lights
- group.energy
- group.system
tab_settings:
name: "Réglages"
view: yes
entities:
- switch.server_media
- group.all_switches
- group.all_automations
Thanks in advance.
First of all thanks to @andrey for your amazing custom-ui
.
I have a feature request, is it possible to add a feature to hide the slider when the light is off?
This will avoid putting lights on accidentily when scrolling through the lights on the phone/tablet.
I use confirmable controls for this
That’s only working for the control button and not for the dimmer slider isn’t it?
In my case I accidentely turn on the light by pressing somewhere on the dimmer slider when scrolling through the page.
That’s a very fair point.
I only use control buttons on my normal ui, and if I want to access a dimmer slider then I hit a control to bring up the pop-up
Can someone confirm if Per entity theming is working with Home Assistant 0.67.1?
EDIT: It’s working fine on Chrome 66 but not on Safari 11.1.
Is it possible to change only the state appearance using Per entity theming?
is this still at hand? quite an issue if one has many carefully selected rgb_color templates… Why is this done at all? In your method, is it the hsl setting you use for hs_color?
I ask because when lets say i need to translate the rgb[251,210,41] I see the following:
Not sure what to use here…
extra question: can we maintain the hex colors? And if so, couldn’t we just use the #fbd229 in this case for the icon color.
Or is it the fact that HA now only uses hs_color for coloring the icons…
Cheers,
Marius
Yes…it seems HA now use some version of HSB. Actually, you cannot even use the B value directly. You need to use a scaled value for brightness. The exact formula for B to be used is (B-50)*5.10 (@NovapaX gave me that formula and I have no idea why it has to be that complicated).
See my config for a working example.
indeed, too bad no documentation on that is to be found anywhere, other than in @balloob 's mentioning it? 0.66: VeSync switches, HomematicIP, and a group cover. - Home Assistant
seems your pointing out the way to calculate the B is way too complicated to be the desired way to go forward in this.
Maybe we’re missing out on some basic info…
I would love to know, if there is one. This clearly is way too complicated to be useful. But, I could not find any other option.
we can still use rgb in scene’s I presume, and in the custom-ui itself for displaying the light values?
light.cabinet:
extra_data_template:
'if (attributes.rgb_color) return "RGB: " + attributes.rgb_color ; return null;'
state_card_mode: break-slider
stretch_slider: true
hide_control: false
show_last_changed: false
#confirm_controls_show_lock: true
slider_theme:
min: 0
max: 255
pin: true
off_when_min: true
report_when_not_changed: true
extra_badge:
- attribute: brightness
unit: Br
- attribute: color_temp
unit: Co
light.frontdoor_hallway:
extra_data_template:
'if (attributes.rgb_color) return "RGB: " + attributes.rgb_color ; return null;'
state_card_mode: break-slider
stretch_slider: true
hide_control: false
show_last_changed: false
#confirm_controls_show_lock: true
slider_theme:
min: 0
max: 255
pin: true
off_when_min: true
report_when_not_changed: true
extra_badge:
- attribute: brightness
unit: Br
- attribute: color_temp
unit: Co

and:
scene:
- name: Opstart
entities:
light.kist:
state: on
transition: 4
brightness: 199
# color_temp: 153
rgb_color: [255,93,42]
- name: Naar bed
entities:
light.bedside_table:
state: on
transition: 4
brightness: 37
# color_temp: 153
rgb_color: [171,58,22]
rgb_color works with light.
For icon color change. Is it right to change the customize as follow;
new
customize:
binary_sensor.door_back_sensor:
templates:
hs_color: "if (state === 'on') return [200, 100]; else return [20, 30];"
old
customize:
binary_sensor.door_back_sensor:
templates:
rgb_color: "if (state === 'on') return [200, 100, 30]; else return [10, 20, 30];"
Yes, that is correct. Although without the brightness, the colors will not match to your rgb colors.
Thank you very much. Do you have any website that I can check the hs_color (number) to see the color so I can re-correct to my customize.
Thank you very much again.

