Navypixel
(Navypixel)
April 4, 2024, 1:47pm
1
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;
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
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