Mal ein neues Dashboard angelegt. Aktualisiert die Werte leider nur alle 5 Minuten. Aber um mal schnell zu schauen reicht es 
6 „Gefällt mir“
Hi, na das sieht doch wirklich schick aus! 
Die Paneel kommen mir bekannt vor. Falls nicht, muss du dir die mal anschauen, dann könnten sie nachts schwarz sein und tagsüber blau mit den badge (Leistung) darauf.
3 „Gefällt mir“
Die Paneele sind einfach png Bilder in der passenden Karte verpackt. Aber Nachts schwarz und Tagsüber blau klingt interessant .
1 „Gefällt mir“
Schaue mal hier: Das ist mit der standard Bild-Elemente-Card gemacht. Die Entitäten kannst du entsprechend anpassen.
3 „Gefällt mir“
Jau danke. Leider passt das dunkle Paneel nicht so ganz zu meinen blauen.
Da ich nicht alle vier so nah nebeneinander haben möchte muss ich mir erst ein passendes Bild basteln
1 „Gefällt mir“
Ändere doch einfach die Farbe von deinem Bild in einem Fotoprogramm auf Schwarz oder schicke es mir, mache ich dir schnell. Den Code kannst du als Vorlage nutzen, musst dann nur die Fotopfade tauschen und sicherlich die Einrückung „top“ „left“ anpassen. Dann erstellst du dir vier einzelne Cards.
type: picture-elements
elements:
- type: state-badge
entity: sensor.power_1
style:
top: 40%
left: 12%
card_mod:
style: |
:host {
color: transparent !important;
font-weight: 0 !important;
font-size: 20px;
transition: background-color 0.3s ease-in-out;
text-transform: var(--ha-label-badge-label-text-transform,uppercase);
--label-badge-red: steelblue !important;
--label-badge-background-color: transparent !important;
--label-badge-text-color:
{% set watt = states('sensor.power_1') | float(0) %}
{% if watt < 10 %}
grey
{% elif watt < 40 %}
steelblue
{% elif watt < 150 %}
yellow
{% elif watt < 250 %}
orange
{% elif watt < 380 %}
green
{% else %}
white
{% endif %};
}
- type: state-label
entity: sensor.power_1
style:
left: 12%
top: 90%
attribute: friendly_name
- type: conditional
conditions:
- condition: numeric_state
entity: sensor.power_1
below: 5
elements:
- type: image
image: /local/sonne/solaroff1.png
state_image: {}
style:
left: 13%
top: 50%
width: 25%
3 „Gefällt mir“
Bild ist schon geändert per Photoshop 
Danke fürs Angebot 
2 „Gefällt mir“
Habe die Tage mal mein Dashboard vom Auto noch ein wenig mit Daten gefüttert und so sieht das Ergebnis jetzt aus! Man kann über die Schieberegler den SOC für das Laden verändern, Auto auf und zuschließen. Sieht den aktuellen Ladepreis, was heute schon geladen worden ist und die geladene Sonnenenergie. Mal sehen was ich noch so an Informationen einbinden kann.
6 „Gefällt mir“
Guten Morgen
Was ist den aktuell das beste seine Dashboard zu organisieren?
Momentan habe ich für jeden Bereich , jedes Zimmer ein eigenes Dashboard unter Dashboard.
Oder macht es mehr Sinn die unter Übersicht zu organisieren. Gibt es ein aktuelles gutes Video dazu ?
Lieben gruß Ole
Moin, da wird dir keiner ein gute Antwort geben können, denn die Geschmäcker sind verschieden. Der eine möchte eine Raumaufteilung, der andere eine Bereichsaufteilung usw. Daher lässt sich das nicht pauschaul beantworten.
Ich habe zum Beispiel Bereiche für Licht, Heizung, Garten, Strom, Wetter und eine Startseite die alles zusammenfasst. Von dort aus komme ich noch in gewisse Unterseiten.
4 „Gefällt mir“
Das ist wirklich Geschmacksache! Es kommt natürlich auch immer darauf an, wie viele Geräte man bspw anzeigen will. Wenn man viele Geräte/ Dinge anzeigen will, macht eine Dashboard Seite pro Raum meistens mehr Sinn, usw. Mach es doch einfach so, wie es dir am besten gefällt und für deinen Anwendungsfall am Praktikabelsten ist Ich habe aktuell für jeden Raum auch eine eigene Seite und das klappt für meinen Anwendungsfall super! Man kann ja sonst auch noch ein 2tes Dashboard erstellen, auf dem man nur einige Daten aus allen Räumen zusammengefasst auf einer Seite anzeigt.
Ich habe es ähnlich wie @jayjojayson
Habe es Nach Temperatur, Licht, Drucker,Solar,Heizung,Strom,Nas usw aufgeteilt. Geschmackssache. Ich fand es so am einfachsten, gebündelt alles auf einem Dashboard. Aber da führen viele Wege nach Rom 
2 „Gefällt mir“
Ich habe mal mein Dashboard für den Drucker weiter ausgebaut. Jetzt gefällt es mir schon ganz gut. An den Proportionen der einzelnen Cards kann man noch etwas arbeiten, aber ansonsten passt es soweit. Die Druckkosten werden über ein Template errechnet, so braucht man nicht extra einen Sensor/Helfer anlegen.
Hier der Code der kompletten Card.
type: custom:stack-in-card
grid_options:
columns: full
card_mod:
style: |
ha-card {
box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px
13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset !important;
border: none;
}
cards:
- type: custom:layout-card
layout_type: custom:grid-layout
layout:
grid-template-columns: 34% 40% 26%
grid-template-rows: auto
mediaquery:
"(max-width: 1000px)":
grid-template-columns: 100%
grid-template-rows: auto
cards:
- type: custom:stack-in-card
card_mod:
style: |
ha-card {
background: rgba(22,22,22,0.2);
border: none;
border-radius: 8px !important;
}
cards:
- type: entities
card_mod:
style: |
ha-card {
background: none;
margin-top: 15px;
padding: 0 10px 0 10px;
border: none;
}
entities:
- entity: sensor.a1_03919c441800312_name_der_aufgabe
name: Druckmodellname
- camera_view: auto
card_mod:
style: |
ha-card {
margin: 0 10px 0 40px;
background: none;
border: none;
border-radius: 5px;
width: 85%;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
}
type: picture-glance
image: https://demo.home-assistant.io/stub_config/kitchen.png
entities: []
camera_image: camera.a1_03919c441800312_kamera
- type: entities
card_mod:
style: |
ha-card {
margin: 0 10px 0 10px;
background: none;
border: none;
}
entities:
- entity: sensor.a1_03919c441800312_aktuelle_schicht
name: Aktuelle Schicht
- entity: sensor.a1_03919c441800312_gesamtzahl_der_schichten
name: Anzahl Schichten
- entity: sensor.a1_03919c441800312_gewicht_des_drucks
name: Gewicht Druck
- entity: sensor.a1_03919c441800312_drucklange
name: Filament Länge
- type: picture-elements
elements:
- type: image
image: /local/bilder/bambua1.png
style:
left: 50%
top: 40%
width: 80%
height: auto
z-index: 0
- type: state-label
style:
left: 47%
top: 29.5%
zoom: 1.2
color: red
entity: sensor.a1_03919c441800312_temperatur_der_duse
prefix: "🌡️ "
- type: state-label
entity: sensor.a1_03919c441800312_druckbetttemperatur
prefix: "🌡️ "
style:
left: 60%
top: 56%
zoom: 1.2
color: darkorange
- type: state-label
entity: sensor.a1_03919c441800312_druckfortschritt
prefix: ⌛
style:
left: 33%
top: 69%
color: black
- type: state-label
style:
left: 52%
top: 69%
color: black
entity: sensor.a1_03919c441800312_verbleibende_zeit
prefix: "⏰ "
- type: image
entity: image.a1_03919c441800312_titelbild
style:
left: 48.5%
top: 42.5%
width: 34%
height: auto
tap_action:
action: perform-action
perform_action: ""
- type: custom:bar-card
style:
left: 50%
top: 80%
width: 90%
height: auto
card_mod:
style: |
ha-card {
border: none !important;
background: none;
--primary-color: #7bc13c !important;
}
#states {
padding: 16px !important;
}
bar-card-currentbar {
border-radius: 3px !important;
{% if states['switch.ecoflow_river_2_ac_enabled'].state == 'on' %}
background: linear-gradient(270deg, red, orange, green);
background-size: 300% 100%;
animation: gradientShiftNormal 3s linear infinite;
clip-path: inset(0 calc(100% - var(--bar-percent)) 0 0);
{% elif states['switch.ecoflow_river_2_dc_12v_enabled'].state == 'on' %}
background: linear-gradient(270deg, red, orange, green);
background-size: 300% 100%;
animation: gradientShiftReverse 3s linear infinite;
clip-path: inset(0 calc(100% - var(--bar-percent)) 0 0);
{% else %}
background: linear-gradient(to right, blue 15%, steelblue 50%, green 100%);
clip-path: inset(0 calc(100% - var(--bar-percent)) 0 0);
{% endif %}
}
bar-card-backgroundbar {
border-radius: 3px !important;
border: 1px solid white !important;
background: linear-gradient(to right, blue 15%, steelblue 50%, green 100%);
clip-path: inset(0 calc(100% - var(--bar-percent)) 0 0);
}
@keyframes gradientShiftNormal {
0% { background-position: 0% 50%; }
100% { background-position: 100% 50%; }
}
@keyframes gradientShiftReverse {
100% { background-position: 0% 50%; }
0% { background-position: 100% 50%; }
}
name: Progress
positions:
name: inside
value: inside
indicator: "off"
icon: "off"
unit_of_measurement: "%"
max: 100
height: 30px
entities:
- entity: sensor.a1_03919c441800312_druckfortschritt
- type: custom:bar-card
style:
left: 50%
top: 87%
width: 90%
height: auto
card_mod:
style: |
ha-card {
border: none !important;
background: none;
--primary-color: #7bc13c !important;
}
#states {
padding: 16px !important;
}
bar-card-currentbar {
border-radius: 3px !important;
background: linear-gradient(to right, green 15%, yellow 25%, orange 50%, darkorange 100%);
clip-path: inset(0 calc(100% - var(--bar-percent)) 0 0);
}
bar-card-backgroundbar {
border-radius: 3px !important;
border: 1px solid white !important;
background: linear-gradient(to right, green 15%, yellow 25%, orange 50%, darkorange 100%);
clip-path: inset(0 calc(100% - var(--bar-percent)) 0 0);
}
@keyframes gradientShiftNormal {
0% { background-position: 0% 50%; }
100% { background-position: 100% 50%; }
}
@keyframes gradientShiftReverse {
100% { background-position: 0% 50%; }
0% { background-position: 100% 50%; }
}
name: Power
positions:
name: inside
value: inside
indicator: "off"
icon: "off"
unit_of_measurement: W
max: 400
height: 25px
entities:
- entity: sensor.3d_drucker_leistung
- type: custom:button-card
title: play
card_mod:
style: |
ha-card {
border-radius: 8px;
}
style:
left: 18%
top: 96%
width: 20%
opacity: 0.7
show_name: false
show_icon: true
entity: button.a1_03919c441800312_druckvorgang_fortsetzen
icon: mdi:play
show_state: false
- type: custom:button-card
title: stop
card_mod:
style: |
ha-card {
border-radius: 8px;
}
style:
left: 42%
top: 96%
width: 20%
opacity: 0.7
show_name: false
show_icon: true
entity: button.a1_03919c441800312_druckvorgang_beenden
icon: mdi:stop
show_state: false
- type: custom:button-card
title: pause
card_mod:
style: |
ha-card {
border-radius: 8px;
}
style:
left: 66%
top: 96%
width: 20%
opacity: 0.7
show_name: false
show_icon: true
entity: button.a1_03919c441800312_druckvorgang_anhalten
icon: mdi:pause
show_state: false
- type: state-label
entity: binary_sensor.a1_03919c441800312_online
style:
left: 86%
top: 96%
zoom: 90%
- type: custom:button-card
title: power
card_mod:
style: |
ha-card {
background: none;
border: none;
}
style:
left: 83%
top: 32%
width: 15%
show_name: false
show_icon: true
entity: switch.3d_drucker_schalter
icon: mdi:toggle-switch-variant-off
show_state: false
- type: custom:button-card
title: led
card_mod:
style: |
ha-card {
background: none;
border: none;
}
style:
left: 83%
top: 42%
width: 15%
show_name: false
show_icon: true
entity: light.a1_03919c441800312_druckraumbeleuchtung
icon: mdi:led-strip-variant
show_state: false
- type: custom:mushroom-fan-card
entity: fan.a1_03919c441800312_druckkopflufter
icon_animation: true
fill_container: false
icon_type: icon
show_percentage_control: false
show_oscillate_control: false
collapsible_controls: false
secondary_info: none
primary_info: none
card_mod:
style: |
ha-card {
background: none;
border: none;
}
ha-state-icon {
zoom: 1.4;
}
mushroom-shape-icon {
--shape-color: none !important;
--shape-color-disabled: none !important;
}
style:
left: 83%
top: 51%
width: 15%
image: /local/bilder/transparent.png
card_mod:
style: |
ha-card {
padding-bottom: 20px;
background: none;
border: none;
}
- type: custom:stack-in-card
card_mod:
style: |
ha-card {
background: rgba(22,22,22,0.2);
border: none;
border-radius: 8px !important;
}
cards:
- type: clock
clock_size: small
time_zone: Europe/Berlin
time_format: "24"
show_seconds: false
card_mod:
style: |
ha-card {
zoom: 0.5;
padding-top: 30px;
display: flex !important;
align-items: right !important;
justify-content: right !important;
text-align: right !important;
border: none !important;
background: none;
}
- type: custom:mini-graph-card
card_mod:
style: |
ha-card {
margin-top: -20px;
border: none !important;
height: 80% !important
border-radius: 0px !important;
font-color: red !important;
}
.header{
padding-bottom: 0px !important;
}
.states{
padding-bottom: 0px !important;
}
entities:
- entity: sensor.a1_03919c441800312_temperatur_der_duse
name: Düse
hours_to_show: 5
points_per_hour: 10
refresh_interval: 30
align_state: center
height: 85
font_size_header: 12
font_size: 100
align_header: center
show:
icon: false
header_icon: false
color_thresholds:
- value: 0
color: grey
- value: 50
color: steelblue
- value: 150
color: yellow
- value: 180
color: green
- type: custom:mushroom-number-card
card_mod:
style: |
ha-card {
border: none;
}
entity: number.a1_03919c441800312_zieltemperatur_der_duse
fill_container: false
primary_info: name
name: Düsentemperatur
- type: custom:mini-graph-card
card_mod:
style: |
ha-card {
border: none !important;
height: 80% !important
border-radius: 0px !important;
font-color: red !important;
}
.header{
padding-bottom: 0px !important;
}
.states{
padding-bottom: 0px !important;
}
entities:
- entity: sensor.a1_03919c441800312_druckbetttemperatur
name: Druckbett
hours_to_show: 5
points_per_hour: 10
refresh_interval: 30
align_state: center
height: 85
font_size_header: 12
font_size: 100
align_header: center
show:
icon: false
header_icon: false
color_thresholds:
- value: 0
color: steelblue
- value: 30
color: blue
- value: 60
color: yellow
- value: 70
color: orange
- value: 80
color: darkorange
- type: custom:mushroom-number-card
card_mod:
style: |
ha-card {
border: none !important;
}
entity: number.a1_03919c441800312_zieltemperatur_des_druckbett
fill_container: false
primary_info: name
name: Druckbetttemperatur
- type: custom:mod-card
card_mod:
style: |
ha-card {
height: 1px;
border-bottom: 1px;
margin: 0px 20px 0 20px;
background-color: grey !important;
}
- type: custom:layout-card
layout_type: custom:grid-layout
layout:
grid-template-columns: 34% 40% 26%
grid-template-rows: auto
mediaquery:
"(max-width: 1000px)":
grid-template-columns: 100%
grid-template-rows: auto
cards:
- type: custom:mushroom-template-card
primary: akt. Druck
layout: vertical
icon: mdi:currency-eur
icon_color: green
fill_container: true
secondary: >
{% set gewicht =
states('sensor.a1_03919c441800312_gewicht_des_drucks') | float %} {%
set kosten_pro_kg = 22 %} {{ ((gewicht / 1000) * kosten_pro_kg) |
round(2) }} €
card_mod:
style: |
ha-card {
background: none;
border: none;
}
- type: custom:ha-bambulab-spool-card
header: Header Text
subtitle: Subtitle Text
show_header: false
show_type: false
spool: 4bd003876839e403232583b940e4b82d
spool_anim_reflection: true
spool_anim_wiggle: true
card_mod:
style: |
ha-card {
background: none;
border: none;
}
.ha-bambulab-spool-card-holder {
height: 50% !important;
width: 50% !important;
margin: 0 auto;
}
.ha-bambulab-spool-card-container {
height: 50% !important;
width: 50% !important;
margin: 0 auto;
}
- type: custom:mushroom-entity-card
entity: sensor.3d_drucker_summe_verbraucht
layout: vertical
name: kWh Summe
primary_info: name
secondary_info: state
icon_type: icon
card_mod:
style: |
ha-card {
background: none;
border: none;
}
Die Picture Elements Card gibt es auch ähnlich direkt mit der Bambulab Integration, aber ich so finde ich die Aufteilung der Infos besser und sind auch ein paar mehr.
Hier noch das Bambulab Bild, falls es einer nachbauen möchte.
5 „Gefällt mir“
Wow, das gefällt mir sehr gut 
Hast du das alles mit Bubble Card umgesetzt?
Ich komme mit dem Styling der Bubble Card gar nicht klar 
Hast du evtl. Den Code für dein Dashboard?
Gruß
Guten Morgen,
aber klar kannst du den Code haben.
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
primary: Wohnzimmer
secondary: >-
{{ states('sensor.wohnzimmer_temperatur_temperature') | round(1) }} °C /
{{ states('sensor.wohnzimmer_temperatur_humidity') | round(1) }} %
icon: mdi:sofa
entity: light.licht_wohnen_left
tap_action:
action: navigate
navigation_path: "#wohnzimmer"
icon_color: "{{ '#bd9100' if is_state(entity, 'on') else '#67783d' }}"
fill_container: true
layout: horizontal
multiline_secondary: false
card_mod:
style: |
:host([dark-mode]) {
background: rgba(var(--rgb-primary-background-color), 0);
}
:host {
background: rgba(var(--rgb-primary-text-color), 0.0);
--mush-icon-size: 96px;
}
ha-card {
margin-left: -25px !important;
margin-top: -25px !important;
height: 102px;
}
- type: custom:mushroom-chips-card
chips:
- type: template
entity: climate.hz_wohnen
content: "{{ state_attr('climate.hz_wohnen','temperature') }}°C"
tap_action:
action: more-info
icon: |-
{% if is_state_attr('climate.hz_wohnen','hvac_action', 'heating') -%}
mdi:heat-wave
{% else %}
mdi:none
{% endif %}
icon_color: |-
{% if is_state('climate.hz_wohnen', 'off') %}
#6f6f6f
{% else %}
red
{% endif %}
- type: template
entity: light.lichter_wohnzimmer_gr
tap_action:
action: more-info
icon: |-
{% if is_state(entity, 'on') %}
mdi:lightbulb-on
{% else %}
mdi:lightbulb-off-outline
{% endif %}
icon_color: |-
{% if is_state(entity, 'on') %}
#5ee0d0
{% else %}
#6f6f6f
{% endif %}
- type: template
entity: input_boolean.prasenz_wohnen
tap_action:
action: more-info
icon: |-
{% if is_state(entity, 'on') %}
mdi:motion-sensor
{% else %}
mdi:motion-sensor-off
{% endif %}
icon_color: |-
{% if is_state(entity, 'on') %}
yellow
{% else %}
#6f6f6f
{% endif %}
card_mod:
style: |
ha-card {
{{ 'animation: clip 2s linear infinite, infiniteboth;' if is_state('input_boolean.prasenz_wohnen', 'on') }}
}
@keyframes clip {
50% { clip-path: polygon(0 0, 35% 0, 100% 100%, 0 100%); }
}
.shape {
--shape-animation: motion 2s linear infinite;
}
@keyframes motion {
0%, 100% { --shape-color: rgba(var(--rgb-blue), 0.3); }
50% { --shape-color: rgba(var(--rgb-blue), 0.2); }
}
- type: template
entity: binary_sensor.wohnzimmer_contact
tap_action:
action: more-info
icon: |-
{% if is_state(entity, 'off') %}
mdi:window-closed
{% else %}
mdi:window-open
{% endif %}
icon_color: |-
{% if is_state(entity, 'off') %}
#6f6f6f
{% else %}
#d42020
{% endif %}
- type: template
entity: media_player.heimkino
tap_action:
action: more-info
icon: |-
{% if is_state(entity, 'paused') %}
mdi:speaker-pause
{% elif is_state(entity, 'playing') %}
mdi:speaker-play
{% else %}
mdi:speaker-stop
{% endif %}
icon_color: |-
{% if is_state(entity, 'playing') %}
#5ee0d0
{% else %}
#6f6f6f
{% endif %}
card_mod:
style: |
ha-card {
{{ 'animation: beat 1.3s ease-out infinite both;' if is_state('media_player.heimkino', 'playing') }}
transform-origin: 50% 60%;
}
@keyframes beat {
0% { transform: scale(1); }
10% { transform: scale(1.1); }
17% { transform: scale(1.05); }
33% { transform: scale(1.25); }
60% { transform: scale(1); }
}
alignment: end
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0;
margin-top: -30px !important;
}
card_mod:
style: |
ha-card {
{% if is_state('light.lichter_wohnzimmer_gr', 'on') %}
background: rgba(0, 91, 108, 0.8);
box-shadow: 0 3px 5px 0 #ffeecc;
{% endif %}
}
ha-card:active {
transform: translateY(1.5px);
transition: 0s;
}
type: vertical-stack
cards:
- type: custom:bubble-card
card_type: pop-up
hash: "#wohnzimmer"
name: Wohnzimmer
icon: mdi:sofa
force_icon: false
show_last_changed: false
show_attribute: false
sub_button: []
show_header: true
entity: sensor.tempsensor_wohnzimmer_temperature
button_type: name
auto_close: ""
close_by_clicking_outside: true
- type: custom:bubble-card
card_type: separator
name: Lichter
icon: mdi:lightbulb
sub_button:
- entity: sensor.steckdose_fernseher_power
show_name: false
show_state: true
show_background: false
show_last_changed: false
show_attribute: false
- entity: sensor.prasenz_wohnzimmer_illuminance
state_background: false
show_state: true
icon: mdi:sun-wireless
- entity: binary_sensor.prasenz_wohnzimmer_presence
show_background: true
styles: >
.bubble-sub-button-2 > ha-icon { color: ${state === 'on' ? 'orange' : ''}
!important; } ${subButtonIcon[2].setAttribute("icon", state === 'on' ?
'mdi:motion-sensor' : 'mdi:motion-sensor-off')}
- type: horizontal-stack
cards:
- type: custom:bubble-card
card_type: button
entity: switch.licht_wohnen_left
name: Couchtisch
icon: mdi:sofa
show_state: false
show_last_changed: false
show_attribute: false
force_icon: false
show_icon: true
scrolling_effect: true
show_name: true
- type: custom:bubble-card
card_type: button
entity: switch.licht_wohnen_right
name: Esstisch
icon: mdi:table-furniture
- type: horizontal-stack
cards:
- type: custom:bubble-card
card_type: button
entity: light.led_fernseher
name: LED Fernseher
icon: mdi:television-classic
show_state: false
show_last_changed: false
show_attribute: false
force_icon: false
show_icon: true
scrolling_effect: true
show_name: true
button_type: slider
use_accent_color: false
hold_action:
action: more-info
tap_action:
action: toggle
slider_live_update: true
sub_button: []
- type: custom:bubble-card
card_type: button
entity: light.led_wandregal
name: LED Wandregal
icon: mdi:wall-sconce
button_type: slider
use_accent_color: false
hold_action:
action: more-info
tap_action:
action: toggle
show_state: false
show_last_changed: false
show_attribute: false
attribute: effect_list
slider_live_update: true
force_icon: false
scrolling_effect: true
- type: custom:bubble-card
card_type: empty-column
- type: custom:bubble-card
card_type: media-player
entity: media_player.fernseher
name: Fernseher
hide:
next_button: true
previous_button: true
play_pause_button: true
volume_button: true
power_button: false
show_state: true
show_last_changed: false
show_attribute: false
force_icon: false
card_layout: large
attribute: source_list
icon: mdi:television
- type: custom:bubble-card
card_type: media-player
entity: media_player.heimkino
card_layout: large
cover_background: false
force_icon: false
show_state: false
show_last_changed: false
show_attribute: true
attribute: volume_level
- type: custom:bubble-card
card_type: separator
name: Heizung
icon: mdi:home-thermometer
- type: custom:bubble-card
card_type: climate
entity: climate.hz_wohnen
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
force_icon: false
show_state: true
show_last_changed: false
show_attribute: true
attribute: current_temperature
state_color: false
- type: custom:stack-in-card
cards:
- type: grid
square: false
columns: 2
cards:
- type: custom:mushroom-entity-card
entity: sensor.wohnzimmer_temperatur_temperature
primary_info: state
secondary_info: name
name: Temperatur
icon_color: green
icon: mdi:thermometer
- type: custom:mushroom-entity-card
entity: sensor.wohnzimmer_temperatur_humidity
primary_info: state
secondary_info: name
name: Luftfeuchte
icon_color: blue
icon: mdi:water-percent
- type: custom:mini-graph-card
entities:
- entity: sensor.wohnzimmer_temperatur_temperature
name: Temperature
color: "#00bb33"
- entity: sensor.wohnzimmer_temperatur_humidity
name: Humidity
color: "#2196f3"
y_axis: secondary
hours_to_show: 24
line_width: 3
font_size: 50
animate: true
show:
name: false
icon: false
state: false
legend: false
fill: fade
Du benötigst noch folgende HACS Karten:
- mushroom
- mini-graph-card
- card-mod
- stack in card
Gruß Daniel
1 „Gefällt mir“
Hey @jayjojayson wie bekommst du deine Codeschnippels farbig hin?
Moin, du kannst dem Code die jeweilige Programmsprache zuordnen. Muss aber immer händisch ergänzt werden, wie im Bild zu sehen.
2 „Gefällt mir“
Den Trick kannte ich auch nich garnicht! Das ist ja super 
Herzlichen Glückwunsch zum Geburtstag übrigens
1 „Gefällt mir“
Lieben Dank. 
Vielen Dank Daniel.
Jetzt habe ich wieder eine Basis an der ich lernen kann
1 „Gefällt mir“