http://…:8123/developer-tools/template
{{ states.sensor.hall_temperature }}
What does the dev tools say?
hvac_modes: auto, heat
min_temp: 5
max_temp: 30
target_temp_step: 0.5
preset_modes: none, eco, boost
current_temperature: 20.4
temperature: 17
hvac_action: idle
preset_mode: none
valve_tappet_position: 0
boschshc_room_name: Wohnzimmer
friendly_name: Room Climate Wohnzimmer
supported_features: 17
Yeah, so {{ state_attr('entity_id', 'current_temperature') }} try something like this
custom_fields:
thermostat: >
[[[ const state = entity.attributes.current_temperature;
return `<svg viewBox="0 0 50 50"><circle cx="25" cy="25" r="20.5" stroke="#b2b2b2" stroke-width="1.5" fill="none" />
<text x="50%" y="54%" fill="#8d8e90" font-size="14" text-anchor="middle" alignment-baseline="middle">${state}°</text></svg>`; ]]]
dont show anything 
- type: custom:button-card
entity: climate.room_climate_wohnzimmer
style:
top: 48%
left: 15%
width: 20%
custom_fields:
thermostat: >
[[[ const state = entity.attributes.temperature;
return `<svg viewBox="0 0 50 50"><circle cx="25" cy="25" r="20.5" stroke="#b2b2b2" stroke-width="1.5" fill="none" />
<text x="50%" y="54%" fill="#8d8e90" font-size="14" text-anchor="middle" alignment-baseline="middle">${state}°</text></svg>`; ]]]
styles: *icon_hue_styles
template: climate
You forgot custom_field in styles. You can also return entity.attributes.temperature as a name or state_display to see if that works first.
Hi Frank,
wie hast du den Heizkörper Butten erstellt? ich würde mich freuen wenn du deinen hier zu verfügung stellst.
this is the thermostat button that i use. its optimized for my iphone view.
- type: custom:button-card
entity: climate.room_climate_wohnzimmer
name: Wohnzimmer
style:
top: 48%
left: 15%
width: 20%
custom_fields:
thermostat: >
[[[ const state = entity.attributes.current_temperature;
return ` <text x="50%" y="54%" fill="#8d8e90" font-size="24%" text-anchor="middle" alignment-baseline="middle">${state}°</text></svg>`; ]]]
styles:
custom_fields:
thermostat:
[filter: "[[[ return entity.state === 'off' ? 'invert(1)' : 'none'; ]]]",
top: 15%, left: 40%, font-size: 3vw, position: absolute, opacity: 0.6]
template: thermostat
2 Likes
Any update on posting the icon svg code? I’d love to use some of them in my setup. Thanks!
I sent the link for my GitHub page with a private message because I’m not sure if it’s right to advertise on this posting for another GitHub.
Update: https://github.com/fastender/blob/tree/master/blob/icons
4 Likes
It’s fine. You can post here 
Hello
Could you please share the svg youre using for the echo-dot?
Thanks in advance
Hi,
for the last some days, I am playing around with passing an entity to an anchor and partially that works, however, not all of it
I am using some window blinds and for those I have defined some scripts for putting them at different times of day at different heights. I am using the custom button in combination with the browser_mod.popup on tap_action.
On that pop_up I am using the entity: script for the different scripts. But because I have those in different rooms I have out all of that together in a template similar to the light template Mattias has defined in his yaml file.
However, here is where the problem starts:
- the entity for a window blind is called “az_rollo_rechts”
- the name of the script is az_rollo_geschlossen_nr
- I have passed the entity to the anchor via: entity: ‘[[[ return entity.entity_id ]]]’ - this works fine.
- now, when I want to add the script, I have to generate the script name, which I tried to do as follows: [[[ return ‘script.’ + entity.entity_id.substring(1, 9) + ‘geschlossen_nr’ ]]]
What I am trying to do here, is to put together the script name based on the entity-id and the script name structure, which should be:
- Part 1: "script.
- Part 2: substring 1-9 of the entity_id, which is: az_rollo_"
- Part 3: and now I am adding the last part: “geschlossen_nr”
But this does not work. I was also trying to define the name before I am moving this to the anchor, but I also cannot get that working
An extract of the code looks like this:
- type: custom:button-card
entity: cover.az_rollo_rechts
.
.
.
.
template: rollos
The relevant extract of the template like this:
- entity: '[[[ return entity.entity_id ]]]'
style: |
:host {
color: rgb(255,255,255,0.8);
}
name: Rollo schliessen
icon: mdi:blinds
tap-action:
action: call_service
service: script.turn_on
service_data:
entity_id: [[[ return 'script.' + entity.entity_id.substring(1, 9) + 'geschlossen_nr' ]]]
I am sure there is something wrong with the code in the brackets but I do not know what to change as I have made already masses of changes 
Anybody can point me in the right direction?
Thanks a lot!
I’m not sure I understand what you’re trying to do. Can you give a more basic example with english entities? You could also try your luck in the button-card thread.
If I put [[[ return 'script.' + entity.entity_id.substring(1, 9) + 'geschlossen_nr' ]]] on my sensor.placeholder it returns script.ensor.plgeschlossen_nr which doesn’t look right.
substring(1, 9) = extract characters counting from zero not including 9
s[ensor.pl]aceholder
Yes, it is a challenge to describe for somebody who is not experienced in coding, like me
Thanks for the hint with starting from 0, I have tried to reflect that in the following example.
Let me give it a try:
-
there is an entity called: az_windowblind
-
there is also a script for that entity to close the window blind called: script.az_windowblind_closed_nr
Because I want to reuse the code via a template, I am trying to generate the script name with following syntax:
[[[ return 'script.' + entity.entity_id.substring(0, 13) + 'closed_nr' ]]]
in order to get script.az_windowblind_closed_nr.
I am doing this, as I have a specific syntax for the entity as well as for the script name following the same structure for different rooms, so that I can use a template in order not to repeatedly have the code in the yaml - learned from you
Whats the domain (cover, sensor, switch) for az_windowblind? You could just replace the domain like this
[[[ return entity.entity_id.replace('cover', 'script') + '_closed_nr'; ]]]
2 Likes
From now on I call you Mr.Genius
Works like charme, thank you, Mr Genius 
What you’ve created is amazing! I’m about to get into a new place and can’t wait to start working on the wall-mounted iPad dashboard using your config.
I’ve been struggling to get custom icons working. I have a custom icon set and I used to use the code inside the path="" in the svg code for the icons. I’ve used your “custom-icons.js” file and replace the code with the one I had, but doesn’t seem to work. How did you get the svg code to work? Something I’m missing?
Here’s an example:
<path d="M6.49438477,13 C6.2213436,13 6.22460938,13 6.49438477,13 L25.5056152,13 C25.7786564,13 25.7753906,13 25.5056152,13 L6.49438477,13 Z M27,9.99999999 C27.5522847,9.99999999 28,10.4477152 28,11 L28,21 C28,21.5522847 27.5522847,22 27,22 L5,22 C4.44771525,22 4,21.5522847 4,21 L4,11 C4,10.4477152 4.44771525,9.99999999 5,9.99999999 L27,9.99999999 Z M23.1262135,12.0007613 L8.87378648,12.0007613 C8.51186996,13.4057531 7.4057531,14.51187 6.00076134,14.8737865 L6.00076134,17.1262135 C7.40608802,17.4882163 8.51239729,18.5947743 8.87404517,20.0002435 L23.1259548,20.0002435 C23.4876889,18.5944393 24.5944393,17.4876889 26.0002435,17.1259548 L26.0002435,14.8740452 C24.5947743,14.5123973 23.4882163,13.406088 23.1262135,12.0007613 Z M16,13 C17.6568542,13 19,14.3431458 19,16 C19,17.6568542 17.6568542,19 16,19 C14.3431458,19 13,17.6568542 13,16 C13,14.3431458 14.3431458,13 16,13 Z"></path>
Would transform into:
'bill':
'M6.49438477,13 C6.2213436,13 6.22460938,13 6.49438477,13 L25.5056152,13 C25.7786564,13 25.7753906,13 25.5056152,13 L6.49438477,13 Z M27,9.99999999 C27.5522847,9.99999999 28,10.4477152 28,11 L28,21 C28,21.5522847 27.5522847,22 27,22 L5,22 C4.44771525,22 4,21.5522847 4,21 L4,11 C4,10.4477152 4.44771525,9.99999999 5,9.99999999 L27,9.99999999 Z M23.1262135,12.0007613 L8.87378648,12.0007613 C8.51186996,13.4057531 7.4057531,14.51187 6.00076134,14.8737865 L6.00076134,17.1262135 C7.40608802,17.4882163 8.51239729,18.5947743 8.87404517,20.0002435 L23.1259548,20.0002435 C23.4876889,18.5944393 24.5944393,17.4876889 26.0002435,17.1259548 L26.0002435,14.8740452 C24.5947743,14.5123973 23.4882163,13.406088 23.1262135,12.0007613 Z M16,13 C17.6568542,13 19,14.3431458 19,16 C19,17.6568542 17.6568542,19 16,19 C14.3431458,19 13,17.6568542 13,16 C13,14.3431458 14.3431458,13 16,13 Z',
What am I missing?
I have an error in my Developer Tools / Logs. I know this is my own doing but I’m not sure how to resolve it.
Logger: homeassistant.util.yaml.loader
Source: util/yaml/loader.py:61
First occurred: June 14, 2020, 7:48:13 AM (738 occurrences)
Last logged: 6:00:08 AM
* YAML file /config/lovelace-panel.yaml contains duplicate key "entity". Check lines 15 and 2108.
* YAML file /config/lovelace-panel.yaml contains duplicate key "entity". Check lines 15 and 2115.
* YAML file /config/lovelace-panel.yaml contains duplicate key "entity". Check lines 15 and 2188.
* YAML file /config/lovelace-panel.yaml contains duplicate key "entity". Check lines 15 and 2671.
* YAML file /config/lovelace-panel.yaml contains duplicate key "entity". Check lines 15 and 2678.
I used most of the example panel yaml. Around line 15 in my code is
anchors:
⚓₁: &title
entity: sensor.placeholder
tap_action:
action: none
hold_action:
action: none
type: state-label
On my panels I wanted to have the time and the temperature as well as various other headings around. I was having trouble with the markup card in the original configuration so I got rid of that and have been using this. Example around line 2108
- entity: sensor.time
<<: *title
style:
top: 9%
left: 3%
<<: *heading-style
I understand here that I am defining an entity for sensor.time and then the *title is taking from above so I understand that sensor.placeholder is being injected here hence the error.
I wanted my own fonts as well so around line 36 I have this to define heading style
⚓4: &heading-style
color: '#bcbebf'
font-family: DB Sans Cond
font-size: 4vw
font-weight: bold
font-style: normal
max-width: 1px
cursor: default
My panels are working great. The headings, time and temperature are showing up where I intended but I get that error which I know is not sustainable.
I do have an issue in that my panels constantly (around 15 minutes) display that “your configuration has been changed, click refresh” etc. I am not sure if this is because of what I have done.
Can anyone help me remove the duplicate sensor to remove the error?
Thank you!!
This is what the left hand side looks like
AND THANK YOU for this project my panels look GREAT
3 Likes
Hey Mattias,
only now really discovering your different take, Ive added these nice info circles to my lights.
There’s some issue with the size and positioning when resizing the screen though:
this is what I added to my light button templates, directly copied from your repo.
do you have a suggestion how to fix this?
1 Like