âŠ
of course I did read that, must admit I cant find anything on the difference between the 2, but will check again.
since you wrote the fold-entity-row too: cant we style a type:divider the same way the very thin line looks like created by the fold-entity-row:
this must be half the thickness of the smallest 0.5px I can set divider border-width toâŠ
Does this replace the
custom:hui-trick?
Yes. Thatâs where the name is from. Thecustom:hui-trick was always a dirty hack that worked by accident rather than design, and since 0.107 it works intermittently at best.
Or in other words: This works always. The old method works sometimes.
And Styles Have Nothing To Do WIth hui-element.
Not sure if this qualifies as âawesomeâ:
A couple of other reminders that rely on using the hui-element:
Yes, Iâve experienced that since installing your card in my setup, especially with markdown cards. No more Red cards in sight. No preloaded needed.
Magic!
Hope itâs awesome enough:
And in default:
Plenty of hui-element (23) but also layout-card, gap-card, template-entity-row, fold-entity-row, and liberal doses of card-mod⊠you get the picture. HA just wouldnât work without your cards.
I second that Thomasâ cards are the first place i go looking, 'cos I know theyâll be useful for more than one thing, reliable and most importantly, well maintained.
@reste_narquois your setup is good, some ideas there I will take away. Have you considered using something like custom:stack-in-card to gel some sections (like your printer info) together, to look like one card?
simply use entities card for that, and the hui-element card of this thread 
Thanks! You mean like this? (using card-mod to get rid of the borderâbackground/box-shadow):
Yeah, tbh, I swing between having a flatter look like this, and the more stack-y look I have at the moment.
I do, in places, but then you have to theme out the borders and drop shadow. Also, stack-in-card allows for horizontal or vertical layouts so itâs more flexible.
agreed, but once you get the hang of the style by card-mod, that is quite easy too 
still, being able to forget about that and simply drop elements in a stack has its merits.
no definitive choice made here, was even forced to use the stack-in-card with a set of button cards, that wouldnât be styled using the hui-element technique.
thereâs many ways to skin a cat
This looks cool. Thanks thomasloven. I am new to HA and starting to modify my UI.
On your example shown below, how do you remove the icon on the first entity âBed Lightâ and move the text to the left (to make it look like the âtitleâ of an entity card)? The show_icon: false doesnât seem to work for entities.
Thanks again!
type: entities
entities:
- light.bed_light
- type: custom:hui-element
card_type: glance
entities:
- light.kitchen_lights
- light.ceiling_lights
https://www.home-assistant.io/lovelace/entities/#options-for-entities
Best way to remove the icon is to set it to one that doesnât exist.
icon: mdi:no-such-icon
But for moving the test to the left, youâre better off looking for some other type of row.
Appreciate your response thomas. More power to you for your great contributions to the HA community.
Hi! Iâm trying to implement the hui-element with my HA. Configuration using ui-lovelace.yaml failed but using the GUI is successful. Are there compatibility issues between the two? I also tried preloader but to no avail.
Here are my configurations:
resources:
#to have glance card inside entity card
- url: /local/hui-element.js?v=1
type: js
#used in parallel with hui-element
- url: /local/your/path/lovelace-card-preloader.js
type: js
preload_cards:
- markdown
- gauge
- element
preload_rows:
- dividertype or paste code here
- icon: mdi:monitor-dashboard
cards:
- type: entities
entities:
- switch.gf_sala_switch_broadlink_salasidelight
- type: custom:hui-element
card_type: glance
entities:
- input_boolean.3f_bedroom_socket_fan_turnontimer
- input_boolean.3f_bedroom_socket_fan_turnofftimer
Note that other .js file are working.
Not working (via mode: yaml):
Not Working (via GUI):
what version of HA are you using, thereâs been a lot of changes recently that you should look into. These include:
type: js
is no longer valid and should be, that might be your problem with hui-element. I think js still works atm for preloader but that probably wonât last.
type: module
And, if you wish to configure resources in yaml, they should now go into configuration.yaml so they can be used in multiple dashboards.
The most obvious problem with preloader is that youâve cut and pasted an example without reading it. I donât expect you created a folder called âyour/path/â in www, or perhaps you did? But preload_rows is also just pasted in.
I have no idea if having both methods enabled at once will cause issues, but Iâd stick to one or the other personally.
TBH both HACS and the gui resources editor are easier ways to add things to resources.
excellent guide here âŠ
the docs
I donât know what happened but the hui-element is already working using the configurations above. Note: I forgot to remove/put â#â in lovelace-card-preloader.js. hui-element is working even without that. Thank you eggman!
Iâm seeing a lot of these errors in the web console:
hui-element TypeError: "o.setConfig is not a function" hui-weather-forecast-card.ts:39
The weird thing is that I donât use the weather-forecast-card.
gets even weirder than that, re-installing the latest card-tools. Alternating this:
with this:
no hui-element named here, so probably another issue. Still, whatâs happening??
update
just in case, Ive filed it in the card-tools repo: https://github.com/thomasloven/lovelace-card-tools/issues/44#issuecomment-650523266
and here: https://github.com/home-assistant/frontend/issues/6261
updated the hui-element card to 2d24269.
