Assistance on creating multiple Light Cards

Im pretty new to Dashboards and YAML, i saw a youtube video with a very nice layout and wanted to try and re-create the following;

Screenshot 2024-04-04 005023

i have installed bubble card but cant figure out how to make a custom card with a RGB bulb that allows me to look like the above. where should i be looking?

This is the most similar thing I’ve managed to do quickly Perhaps you have a good starting point here

image

type: custom:layout-card
layout_type: custom:vertical-layout
layout: {}
cards:
  - type: custom:stack-in-card
    cards:
      - type: custom:layout-card
        layout_type: custom:grid-layout
        layout:
          grid-template-columns: 95% 5%
        cards:
          - type: custom:fold-entity-row
            open: false
            head:
              type: custom:mushroom-light-card
              entity: light.hue
              use_light_color: true
              show_color_temp_control: false
              collapsible_controls: false
              show_brightness_control: false
              show_color_control: false
              icon: mdi:led-strip-variant
              card_mod:
                style: |
                  ha-card {
                    {% set r = state_attr(config.entity, 'rgb_color')[0] %}
                    {% set g = state_attr(config.entity, 'rgb_color')[1] %}
                    {% set b = state_attr(config.entity, 'rgb_color')[2] %}
                    background: rgba( {{r}}, {{g}}, {{b}}, 0.2 );
                  }          
            group_config:
              show_brightness_control: true
              show_color_temp_control: true
              show_color_control: false
              use_light_color: true
              hide_state: true
              collapsible_controls: true
            entities:
              - type: custom:mushroom-light-card
                entity: light.hue
                use_light_color: true
                show_color_temp_control: true
                collapsible_controls: false
                show_brightness_control: false
                show_color_control: false
                primary_info: none
                secondary_info: none
                icon_type: none
              - type: custom:mushroom-light-card
                entity: light.hue
                use_light_color: true
                show_color_temp_control: false
                collapsible_controls: false
                show_brightness_control: true
                show_color_control: false
                primary_info: none
                secondary_info: none
                icon_type: none

If you can live without folding it out, the mushroom light card is the right choice for you. There are countless good examples to be found in the community thread