This is an automated archive made by the Lemmit Bot.
The original was posted on /r/homeassistant by /u/rad1xs on 2026-03-11 19:29:02+00:00.
It's very simple, it uses the following HACS:
- stack-in-card
- custom:button-card
- mini-graph-card
CODE:
type: custom:stack-in-card
cards:
- type: grid
square: false
columns: 2
cards:
- type: custom:button-card
entity: sensor.[your temp sensor]
name: [name you prefer]
show_state: true
icon: mdi:thermometer
tap_action:
action: none
styles:
grid:
- grid-template-areas: "\"i n\" \"i s\""
- grid-template-columns: 0.6fr 1.4fr;
- grid-template-rows: 1fr 1fr;
card:
- margin: 0
- border-radius: 20px
- padding: 10px 2px 2px 2px
img_cell:
- background: "#E36A6A"
- border-radius: 50px
- width: 35px
- height: 35px
icon:
- justify-self: start
- width: 20px
- color: white
name:
- padding-top: 4px
- justify-self: start
- font-size: 12px
- font-weight: 500
state:
- justify-self: start
- font-size: 12px
- font-weight: 700
- type: custom:button-card
entity: sensor.[your hum sensor]
name: [name you prefer]
show_state: true
icon: mdi:water
tap_action:
action: none
styles:
grid:
- grid-template-areas: "\"i n\" \"i s\""
- grid-template-columns: 0.6fr 1.4fr;
- grid-template-rows: 1fr 1fr;
card:
- margin: 0
- border-radius: 20px
- padding: 10px 2px 2px 2px
img_cell:
- background: "#06bfeb"
- border-radius: 50px
- width: 35px
- height: 35px
icon:
- justify-self: start
- width: 20px
- color: white
name:
- padding-top: 4px
- justify-self: start
- font-size: 12px
- font-weight: 500
state:
- justify-self: start
- font-size: 12px
- font-weight: 700
- type: grid
square: false
columns: 1
cards:
- type: custom:mini-graph-card
entities:
- entity: sensor.[your temp sensor]
name: Temperature
color: "#E36A6A"
- entity: sensor.[your hum sensor]
name: Humidity
color: "#06bfeb"
y_axis: secondary
hours_to_show: 48
line_width: 3
font_size: 100
animate: false
show:
name: false
icon: false
state: false
legend: false
fill: fade