Fresh install not working custom: hui-element

Configuration Frontend
1

Hi there,

I am very new to Home Assistant, I have a strong IT background (linux, big data) and I thought, getting into it won’t be so hard.
So I created a fresh new dashboard, I got into RAW Configuration and added this code:


views:
  - title: HUI-Test
    cards:
      - type: custom:hui-element
        card_type: markdown
        content: Hallo Welt!

This always gives me an error: “Custom element doesn’t exits: hui-element”

May someone point me into the correct direction. Tried with AI all day, even did a complete fresh install, removed me pihole from the network, I am totally lost atm.

2

Not sure where you got that hui-element from.

Try to replace hui-element with markdown and then delete the other line with markdown.

3

This is a custom card and should be installed either manually or by HACS.

1 Like
4

…if you need it. Which you don’t in this case. As you are not using the markdown card anywhere odd, like inside an entities card.

Just do what Wally said.

views:
  - title: HUI-Test
    cards:
      - type: markdown
        content: Hallo Welt!

Here’s an example of where you would need the custom card hui-element:

views:
  - title: HUI-Test
    cards:
       -  type: entities
          title: Entities Card containing markdown card
          entities:
            - type: custom:hui-element 
              card_type: markdown # this normally does not belong in an entity row
              content: Hallo Welt!
5

WOW big thanks for the fast replies!
Loving communities like this one <3…

@Ildar_Gabdullin nailed my problem. I asked AI to help me out with a dashboard, and I got stuck with hui-elements not working, AI keep telling me: Your installation or Computer is broken, so I even did a new install but HACS did the trick.

6

And as usual you have been given bullshit advice by the LLM. Please stop using it until you can recognise this. Otherwise you are just wasting your (and our) time.

You do not need this card.

Please read what I wrote previously.

7

Thank you, I already read your post, the example I posted was purely for debugging purposes to see if hue-element worked at all. It didn’t because the extension was missing. So I don’t want to use the map like that :).

The code I’m working on looks more like this:

 card:
                    type: custom:hui-element
                    card_type: vertical-stack
                    cards:    
                    - type: 'custom:button-card' 
                      name: Living Room Lights
                      entity: sensor.placeholder
                      show_name: true
                      show_icon: false
                      state:  
                        - operator: default
                          styles:
                            card: [background-color: none]  
                            name: [color: '#ffffff']
                            state: [color: '#ffffff'] 
                            icon:  [color: '#ffffff'] 
                      styles:
                        name:
                          - justify-self: middle
                          - font-size: 1.8vw
                          - font-weight: 550
                          - font-familly: 'Arial, Helvetica, sans-serif'
                          - cursor: default
                      style: |
                        ha-card {
                          box-shadow: none;
                        } 
                        
                    - type: custom:hui-element
                      card_type: horizontal-stack
                      cards:                 
                      - type: custom:light-popup-card
                        entity: '[[[ return entity.entity_id ]]]'
                        icon: mdi:wall-sconce-flat
                        fullscreen: false
                        brightnessWidth: 90px
                        brightnessHeight: 350px
                        borderRadius: 1.8em
                        sliderColor: '#c7c7c7'
                        sliderTrackColor: rgba(25, 25, 25, 0.9)
                        actionsInARow: 2
                        actionSize: 5em
                        actions:
                          - service: scene.turn_on
                            service_data:
                              entity_id: scene.day
                            color: black
                            icon: 'mdi:brightness-5'
                          - service: scene.turn_on
                            service_data:
                              entity_id: scene.afternoon
                            color: black
                            icon: 'mdi:brightness-6'
                          - service: scene.turn_on
                            service_data:
                              entity_id: scene.evening
                            color: black
                            icon: 'mdi:brightness-7'
                          - service: scene.turn_on
                            service_data:
                              entity_id: scene.late_night
                            color: black
                            icon: 'mdi:brightness-3'
                      - type: custom:light-popup-card
                        entity: light.living_room_light
                        icon: mdi:track-light
                        fullscreen: false
...

And please, nobody likes to waste your time, so just don’t answer newbie questions when they do just that. Look, the community did a great job, I understood and learned a lot again.

And yes, I use AI, super successfully, because I’m not 20 anymore, I have a house, child, dog, wife, car, friends, … I no longer have the time I used to have to understand every technology that looks kind of fancy in depth by reading documentation. And I come from a world where that was the only way, I’ve been using Linux since 1996, so if you’ve been around since then, you know how to read documentation.

I use Gemini as a counterpart for my ideas and not as a code generator that I just let babble something down.

So please accept my apologies, I didn’t mean to waste your time, but please take 10 seconds to think about how you come across to someone who has written their first post here, and that as a moderator who should be a figurehead of their community.

8

Yeh ok. In future please don’t do this:

The actual code you are trying helps much more. For example, this still does not show why you need to use hui-element with the vertical stack cards:

And you can place horizontal stacks inside vertical stacks without it. hui-element is not needed here:

                    - type: custom:hui-element
                      card_type: horizontal-stack
                      cards:

The LLM is bullshitting you, not helping.

One other thing to be aware of regarding these forums and LLMs: Want to help others? Leave your AI at the door - Home Assistant THis specifically applies to using it to help others.

9

I think the forum is mostly answering newbie questions, because the learning curve can be pretty steep.
It is the AI generated stuff that are hard, because the AI blurs it all with it often completely wrong code, which makes it even harder to guess the intension of the user.
If the user has tried himself toget it working then we can often guess why. AI is a black box.

10

In general, hui-element is used:

  1. To place card XXX into card YYY which does not accept this card XXX normally. Example - vertical-stack into Entities card.
  2. To place a STOCK card into Picture elements card: it can contain only custom cards as elements (along with usual elements like image, state-badge etc). Example - Entities card inside Picture elements card.
  3. (advanced) To place a STOCK entity row inside a decluttering card. Example - a stock “section” row with customized styles etc inside decluttering card.