Hey there, how do you get the temperature to show up in your livingroom button?
Hey there, would you mind sharing the code with us?
Sure.
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
icon: mdi:shower
icon_color: blue
layout: vertical
tap_action: null
action: navigate
navigation_path: pokoje
primary: Åazienka
multiline_secondary: true
secondary: >-
Temp: {{
state_attr('climate.hmip_wth_2_000a9be9a3e3ae','current_temperature')|float}}°C
WilgotnoÅÄ: {{
state_attr('climate.hmip_wth_2_000a9be9a3e3ae','current_humidity')|float}}%
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: custom:mushroom-chips-card
chips:
- type: light
entity: light.lazienka_swiatlo
content_info: none
use_light_color: false
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: light
entity: light.lazienka_led
content_info: none
use_light_color: false
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: template
entity: light.lazienka_led
content_info: none
use_light_color: false
card_mod: null
icon: mdi:fan
icon_color: |2-
{% set state=states('light.lazienka_led') %}
{% if state=='on' %}
green
{% elif state=='off' %}
black
{% endif %}
style: |
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
ha-card {
box-shadow: 0px 0px;
animation: rotation linear infinite;
{% if states('light.lazienka_led') == 'on' %}
animation-duration: 3s;
{%- else -%}
{%- endif %}
}
- type: light
entity: light.lazienka_led
content_info: none
use_light_color: false
card_mod: null
icon: mdi:radiator
style: |
ha-card {
box-shadow: 0px 0px;
}
alignment: center
Thank you a ton!!
The horizontal and vertical stacks are the cards Iām using all the time, I;m not so good at card-mod therefore I used your option with no borders.
Finally, I think my Mobile dashboard is ready !
The buttons on top navigates to Power, Network, Weather etc, I removed names to have clear mobile view
Great, glad I could help! 
Hi, this is the title and the first card
type: vertical-stack
cards:
- type: custom:mushroom-title-card
title: Riepilogo
- square: false
columns: 2
type: grid
cards:
- type: custom:vertical-stack-in-card
cards:
- type: custom:mushroom-template-card
secondary: Cucina e soggiorno
icon: mdi:sofa
tap_action:
action: navigate
navigation_path: soggiorno
icon_color: blue
multiline_secondary: true
primary: Zona giorno
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.temperatura_soggiorno
icon_color: blue
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: entity
entity: sensor.umidita
icon_color: blue
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
alignment: center
Mushroom 1.7.3 is out!
Fastest Mushwroooom ever, thank you so much, @piitaya and collaborators!
What are those room cards made of? Is that stack-in-card with chips on top and then a mushroom-template-card?
For inspirationā¦
stack-in-card + (mushroom-template-card + custom:mushroom-chips-card) + box-shadow: 0px 0px and animation blink and rotation

type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
icon: mdi:shower
icon_color: blue
layout: vertical
tap_action: null
action: navigate
navigation_path: pokoje
primary: Åazienka
multiline_secondary: true
secondary: >-
Temp: {{
state_attr('climate.hmip_wth_2_000a9be9a3e3ae','current_temperature')|float}}°C
WilgotnoÅÄ: {{
state_attr('climate.hmip_wth_2_000a9be9a3e3ae','current_humidity')|float}}%
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: custom:mushroom-chips-card
chips:
- type: light
entity: light.lazienka_swiatlo
content_info: none
use_light_color: false
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: light
entity: light.lazienka_led
content_info: none
use_light_color: false
card_mod: null
style: |
ha-card {
box-shadow: 0px 0px;
}
- type: template
entity: light.lazienka_led
content_info: none
use_light_color: false
card_mod: null
icon: mdi:fan
icon_color: |2-
{% set state=states('light.lazienka_led') %}
{% if state=='on' %}
green
{% elif state=='off' %}
black
{% endif %}
style: |
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
ha-card {
box-shadow: 0px 0px;
animation: rotation linear infinite;
{% if states('light.lazienka_led') == 'on' %}
animation-duration: 3s;
{%- else -%}
{%- endif %}
template
- type: template
entity: light.lazienka_led
content_info: none
use_light_color: false
card_mod: null
icon: |2-
{% set state=states('light.lazienka_led') %}
{% if state=='on' %}
mdi:radiator
{% elif state=='off' %}
mdi:radiator-disabled
{% endif %}
icon_color: |2-
{% set state=states('light.lazienka_led') %}
{% if state=='on' %}
red
{% elif state=='off' %}
black
{% endif %}
style: |
ha-card {
{% if states('light.lazienka_led') == 'on' %}
animation: blink 0.1s linear infinite;
}
@keyframes blink {
50% {opacity: 0;}
}
{%- else -%}
box-shadow: 0px 0px;
{%- endif %}
ha-card {
box-shadow: 0px 0px;
alignment: center
please share your yaml codeā¦
Thanks for your wonderful work. I see some users are able to add temperatures under their buttons/rooms, do you have an example of how to do this?
To just add text, use a template card and then you can use templates in the primary and secondary text. Iām using this for temp and humidity. This can be done with just one card.
{{ states("sensor.ble_temperature_sensor") }} °C - {{states("sensor.ble_humidity_sensor") }}%
Some other people are using stack-in-card and vertical-stack-in-card to put chips instead.
Nice work @RodgerDodger
Could you please share the whole code 
Thank you, but Iām only a fan ![]()
Please have a look at xisioās code: #675 by xisio
Thanks for getting me somewhere. Right now i have this as result;
- type: custom:mushroom-template-card
primary: light.kitchen
name: Kitchen
show_brightness_control: true
use_light_color: true
icon: mdi:spotlight-beam
multiline_secondary: true
layout: vertical
secondary: >
{{ states("sensor.philips_sml001_c6710202_temperature") }} °C -
{{states("sensor.philips_sml001_fde90002_illuminance") }} lux
However, brightness control, color control and name āKitchenā wont get applied, am i missing something?
You are using a mushroom-template-card but values that is from the light card.
https://github.com/piitaya/lovelace-mushroom/blob/4a65c3946c1ce7422805784a60e7b72458a60ec7/docs/cards/template.md
Bummer, i canāt have the slider + the addition information(?) temp, lux etc etc?
Thank you and yes. Itās the first card and as I mentioned Iāve a room specific view behind every room and person card.
All uppercase words are based on my personal entities or gusto.
kiosk_mode:
mobile_settings:
hide_header: true
ignore_entity_settings: true
custom_width: 812
views:
- theme: Google Theme
title: Home
icon: mdi:home
visible:
- user: PERSON_1
- user: PERSON_!
badges: []
cards:
- type: custom:swipe-card
cards: []
- type: custom:mushroom-chips-card
chips:
- type: weather
entity: weather.home
show_conditions: true
show_temperature: true
- type: entity
entity: sensor.count_LIGHTS_ON
icon: mdi:lightbulb-alert
name: LIGHT
icon_color: amber
hold_action:
action: call-service
service: light.turn_off
service_data: {}
target:
entity_id: light.WHOLE_HOUSE
alignment: center
- type: custom:mushroom-template-card
primary: |-
{% set time = now().hour %}
{% if (time >= 18) %}
EVENING_GREETING, {{user}}!
{% elif (time >= 12) %}
DAY_GREETING, {{user}}!
{% elif (time >= 5) %}
MORNING_GREETING, {{user}}!
{% endif %}
secondary: |-
{% set time = now().hour %}
{% if (time >= 18) %}
MOTIVATIONAL_EVENING_QUESTION
{% elif (time >= 12) %}
MOTIVATIONAL_DAY_QUESTION
{% elif (time >= 5) %}
MOTIVATIONAL_MORNING_SAYING
{% endif %}
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
layout: horizontal
multiline_secondary: false
- type: custom:state-switch
entity: user
default: default
states:
PERSON_!:
type: conditional
conditions:
- entity: calendar.GOOGLE_BIRTHDAY_CALENDAR
state: 'on'
card:
type: custom:mushroom-template-card
layout: horizontal
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
icon: mdi:cake
primary: '{{ state_attr(''calendar.GOOGLE_BIRTHDAY_CALENDAR'', ''message'') }}'
- type: conditional
conditions:
- entity: sensor.ORGANIC_WASTE
state: TOMORROW
card:
type: custom:mushroom-title-card
subtitle: INFORMATIONS
- type: horizontal-stack
cards:
- type: conditional
conditions:
- entity: sensor.ORGANIC_WASTE
state: TOMORROW
card:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.ORGANIC_WASTE
icon_color: deep-orange
name: 'TRASH_WILL_BE_PICKED_UP_TOMORROW:'
content_info: name
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
icon: mdi:delete-circle-outline
alignment: justify
- type: horizontal-stack
cards:
- type: conditional
conditions:
- entity: sensor.YELLOW_BAG
state: TOMORROW
card:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.YELLOW_BAG
icon_color: yellow
name: YELLOW_BAG
icon: mdi:delete-empty
tap_action:
action: none
hold_action:
action: none
target: {}
double_tap_action:
action: none
content_info: none
alignment: center
- type: conditional
conditions:
- entity: sensor.PAPER_WASTE
state: TOMORROW
card:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.PAPER_WASTE
icon_color: blue
icon: mdi:delete-empty
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: center
- type: conditional
conditions:
- entity: sensor.ORGANIC_WASTE
state: TOMORROW
card:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.ORGANIC_WASTE
icon_color: green
name: ORGANIC_WASTE
icon: mdi:delete-empty
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: center
- type: conditional
conditions:
- entity: sensor.RESIDUAL_WASTE
state: TOMORROW
card:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.RESIDUAL_WASTE
icon_color: grey
name: RESIDUAL_WASTE
icon: mdi:delete-empty
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
content_info: none
alignment: center
- type: custom:mushroom-title-card
subtitle: FAMILY
- type: horizontal-stack
cards:
- type: custom:mushroom-person-card
entity: person.PERSON_1
name: PERSON_1
use_entity_picture: true
layout: vertical
hold_action:
action: navigate
navigation_path: PERSON_1
- type: custom:mushroom-person-card
entity: person.PERSON_2
name: PERSON_2
use_entity_picture: true
layout: vertical
hold_action:
action: navigate
navigation_path: PERSON_2
hide_name: false
- type: custom:mushroom-person-card
entity: device_tracker.MY_CAR
name: MY_CAR
use_entity_picture: true
layout: vertical
hold_action:
action: navigate
navigation_path: car
hide_state: false
hide_name: false
- type: custom:mushroom-title-card
subtitle: ROOMS
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: light.OFFICE
tap_action:
action: navigate
navigation_path: OFFICE
icon_color: amber
layout: horizontal
hold_action:
action: toggle
primary_info: name
secondary_info: none
icon: hue:room-office
name: OFFICE
- type: custom:mushroom-entity-card
entity: light.BATHROOM
name: BATHROOM
icon_color: amber
layout: horizontal
tap_action:
action: navigate
navigation_path: BATHROOM
icon: mdi:bathtub
secondary_info: none
hold_action:
action: toggle
primary_info: name
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: light.BEDROOM
icon_color: amber
tap_action:
action: navigate
navigation_path: BEDROOM
hold_action:
action: toggle
layout: horizontal
secondary_info: none
- type: custom:mushroom-entity-card
entity: light.NURSERY
icon_color: amber
layout: horizontal
tap_action:
action: navigate
navigation_path: NURSERY
secondary_info: none
hold_action:
action: toggle
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
icon: mdi:sofa
entity: light.LIVING_ROOM
icon_color: |-
{% if is_state('light.LIVING_ROOM', 'on') %}
amber
{% else %}
#646464
{% endif %}
primary: LIVING_ROOM
secondary: |-
{% if is_state('select.HARMONY_HUB_activities', 'PowerOff') %}
{% elif is_state('select.HARMONY_HUB_activities', 'HARMONY_ACTIVITY_1') %}
HARMONY_ACTIVITY_1
{% elif is_state('select.HARMONY_HUB_activities', 'HARMONY_ACTIVITY_2') %}
HARMONY_ACTIVITY_2
{% elif is_state('select.HARMONY_HUB_activities', 'HARMONY_ACTIVITY_3') %}
HARMONY_ACTIVITY_3
{% else %}
{% endif %}
hold_action:
action: call-service
service: light.toggle
service_data: {}
target:
entity_id: light.LIVING_ROOM
double_tap_action:
action: none
tap_action:
action: navigate
navigation_path: LIVING_ROOM
- type: custom:mushroom-entity-card
entity: light.DINING_ROOM
icon_color: amber
layout: horizontal
tap_action:
action: navigate
navigation_path: DINING_ROOM
secondary_info: none
icon: hue:room-dining
hold_action:
action: toggle
- type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: light.KITCHEN
icon_color: amber
layout: horizontal
tap_action:
action: navigate
navigation_path: KITCHEN
name: KITCHEN
icon: ''
secondary_info: none
primary_info: name
hold_action:
action: toggle
- type: custom:mushroom-template-card
entity: light.decke_PANTRY
secondary: " {% if is_state('vacuum.VACCUM_NAME', 'docked') %}
{% elif is_state('vacuum.VACCUM_NAME', 'cleaning') %}
VACUUM IS CLEANING
{% elif is_state('vacuum.VACCUM_NAME', 'returning') %}
VACUUM IS RETURNING
{% elif is_state('vacuum.VACCUM_NAME', 'error') %}
VACUUM ERROR
{% elif is_state('vacuum.VACCUM_NAME', 'paused') %}
VACUUM IS PAUSED
{% else %}
{% endif %}
primary: PANTRY
tap_action:
action: navigate
navigation_path: PANTRY
hold_action:
action: toggle
double_tap_action:
action: none
icon_color: |-
{% if is_state('light.PANTRY', 'on') %}
amber
{% else %}
#646464
{% endif %}
icon: mdi:food
card_mod:
style: |
ha-card {
--secondary-text-color: {{ 'red' if is_state('vacuum.VACUUM_NAME', 'error') else '' }};;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
icon: hue:room-laundry
entity: light.UTILITY_ROOM
icon_color: >-
{% if is_state('input_select.washing_machine_state', 'ready') and
is_state('input_select.dryer_state', 'ready') %}
#646464
{% elif is_state('input_select.washing_machine_state', 'washing') and is_state('input_select.dryer_state', 'drying') %}
blue
{% elif is_state('input_select.dryer_state', 'ready') and is_state('input_select.washing_machine_state', 'washing') %}
green
{% elif is_state('input_select.washing_machine_state', 'ready') and is_state('input_select.dryer_state', 'drying') %}
purple
{% else %}
none
{% endif %}
primary: UTILITY_ROOM
secondary: >-
{% if is_state('input_select.washing_machine_state', 'ready') and
is_state('input_select.dryer_state', 'ready') %}
{% elif is_state('input_select.washing_machine_state', 'washing') and is_state('input_select.dryer_state', 'drying') %}
WASHING & DRYING
{% elif is_state('input_select.dryer_state', 'ready') and is_state('input_select.washing_machine_state', 'washing') %}
WASHING
{% elif is_state('input_select.washing_machine_state', 'ready') and is_state('input_select.dryer_state', 'drying') %}
DRYING
{% else %}
none
{% endif %}
hold_action:
action: none
double_tap_action:
action: none
tap_action:
action: navigate
navigation_path: UTILITY_ROOM
- type: custom:mushroom-template-card
icon: |-
{% if is_state('cover.GARAGE_DOOR', 'closed') %}
mdi:garage-variant-lock
{% elif is_state('cover.GARAGE_DOOR', 'open') %}
mdi:garage-open-variant
{% elif is_state('cover.GARAGE_DOOR', 'opening') %}
mdi:garage-alert-variant
{% elif is_state('cover.GARAGE_DOOR', 'closing') %}
mdi:garage-alert-variant
{% else %}
{% endif %}
entity: cover.GARAGE_DOOR
icon_color: |-
{% if is_state('cover.GARAGE_DOOR', 'closed') %}
#646464
{% elif is_state('cover.GARAGE_DOOR', 'open') %}
red
{% elif is_state('cover.GARAGE_DOOR', 'opening') %}
yellow
{% elif is_state('cover.GARAGE_DOOR', 'closing') %}
yellow
{% else %}
{% endif %}
primary: GARAGE
secondary: |-
{% if is_state('cover.GARAGE_DOOR', 'closed') %}
{% elif is_state('cover.GARAGE_DOOR', 'open') %}
OPEN
{% elif is_state('cover.GARAGE_DOOR', 'opening') %}
IS OPENING
{% elif is_state('cover.GARAGE_DOOR', 'closing') %}
IS CLOSING
{% else %}
{% endif %}
tap_action:
action: navigate
navigation_path: GARAGE
hold_action:
action: none
double_tap_action:
action: none
Can you share your person card code please? It it just a stack-in card with no border? Looks great!

