Nope. It’s completely abandoned and the repository has been deleted.
There is a replacement that is very easy to switch over to for Lovelace:
Or the full featured version that will take you a bit more work but is well worth it:
1 Like
yes, that is really a pity.
you can still use text_align: center in the config, which takes care of horizontal aligning, havent been abel to find the vertical solution either…
the new lovelace-cards is a bit finicky also…and takes out all space between the tiles (using the legacy config here)
might have to switch to the fun version after all…and be forced to go for Lovelace
1 Like
Sadly even rodrigofragadf’s version seems to be abandoned now. I’m using the full version as it really is great, but as of some changes in 0.88 it doesn’t quite look the same (effects, borders, etc.).
I still haven’t found another way to do things nearly as well.
It’s worth the hassle. The full version gives you control over the padding and tons of other settings.
Yeah, now there’s no feedback that you’ve actually pressed the button . It used to dim when pressed.
Hey guys thanks for the feedback - I am having a go with the lovelace options now.
I am having a few head-scratchers following the git ReadMe though - it seems that the only way I can actually effect the ‘views’ with, is by editing the ‘/config/.storage/lovelace’ file.
It seems to have been auto-created based on my existing ‘groups.yaml’. It’s in json format, but hopefully I can take existing yaml + some of the examples in this thread, and convert them over to json (as opposed to manually writing the /config/.storage/lovelace from scratch).
Is this the file you guys are editing?
EDIT: just found this: https://www.home-assistant.io/lovelace/yaml-mode/
Maybe I need to enable yaml mode 
EDIT 2: I enabled yaml mode. Then I took the /config/.storage/lovelace file and converted it to yaml (using an online JSON-to-YAML converter). I copied that yaml into my ui-lovelace.yaml - and BAM I am now 90% of the way there (nearly back to my old config, but needing the tiles remade), formatting looks awesome already.
Hopefully that helps someone out there!! I imagine that saved a lot of pain?
There is no need to do any of that. Click the three dots icon in the top left of HA. Select Configure UI. Click the three dots again and select RAW. You now have a yaml view you can edit.
However there’s not even any need to do that.
Click the three dots icon in the top left of HA. Select Configure UI. Click the (+) icon lower right to add a new card.
Select a manual card and paste or write your yaml for the card there.
I find writing my cards in an editor easier. Then I paste into a new manual card. Writing in the new card directly can bog the web browser down eventually.
1 Like
Very nice! Lovelace is more mature than I realised. Thanks for the pointers!
Now I just need to figure out these tiles…
I can’t get images to display - the following code just shows a grey rectangle (instead of a 1x4 column image):
type: 'custom:tiles-card'
card_settings:
align: center
gap: 10px
padding: 0px
columns: 4
row_height: 75px
column_width: 72px
entities:
- entity: script.update_synoplayers
templates:
style_template: >-
return "background-image: url(/local/musicbanner2.png); background-size:
contain;"
row: 1
column: 1
column_span: 4Has anyone successfully used images (png) with the latest version?
I cannot get the images to display within the tiles, despite trying all the (slightly) differing examples on this thread.
I’m assuming that these examples in this thread are for the legacy version?
Or perhaps my version of Home Assistant (0.91.2) has broken the image display?
Yes I have. I’m using some local material design icon pngs because they’re not available in HA yet (or weren’t when I wrote the card):
The pngs go in your www folder and are used like this:
- column: 3
entity: script.lounge_kodi_player_skip_fwd_10
icon:
value: /local/icons/fast-forward-10.png
row: 5
Note: my png files are in a subdirectory of the www folder called ‘icons’. You don’t have to do this but it keeps things organised.
1 Like
Excellent thanks @tom_l
by the way, I also had downloaded my own png while mdi:fast-forward-10 was missing. It is available in v0.91.2.
Thanks for the heads up on the icons.
No probs. Hey - your ‘icon’ approach worked - but the image is squished to the size of an icon… can we define the icon size?
I am searching, but this thread is bloody large eh
You can use:
icon:
value: /local/icons/fast-forward-10.png
size: 18px # whatever size you want
1 Like
Hi everyone - does the “icon_template” method work in the latest lovelace tiles/Home Assistant version?
I cannot get any of the examples here to work. Here is what my code is at now - no error, just no icon either;
- entity: switch.pioneer_mutetoggle
icon_template: >-
if (state === 'on') return 'mdi:volume-high';
return 'mdi:volume-low';
I have also tried standard Jinja templating to no effect:
- entity: switch.pioneer_mutetoggle
icon_template:
'{% if states.media_player.pioneer.attributes.is_volume_muted == false %}
mdi:volume-high
{% elif (states.media_player.pioneer.attributes.is_volume_muted == true) %}
mdi:volume-mute
{% else %}
mdi:volume-low
{% endif %}'I’m using the new version but the following works ok for me which may help. Might be worth trying double quotes and else.
templates:
label_sec: "return 'Windows: ' + entities['sensor.windows_open'].state;"
style: "return 'font-weight: bold;'"
icon: "if (state === 'on') return 'mdi:window-open'; else return 'mdi:window-closed'"
1 Like
the else is not necessary.
you could try multiline notation to prevent issues and confusion with single and double quotes:
templates:
label_sec: >
return 'Windows: ' + entities['sensor.windows_open'].state;
style: >
return 'font-weight: bold';
icon: >
if (state === 'on') return 'mdi:window-open'; return 'mdi:window-closed';
Note1: that the single quotes need to come before the ; and not after. I’ve adapted this set of templates to do so.
Note2: each line should end with a ; and I’ve added that to the final line.
Note3. It might not work in this card, then please ignore the multiline suggestion, but do follow the notes 1 and 2 
2 Likes
Has anyone been able to get Fontawesome icons working with this?
I seem to be able to use fontawesome in pretty much all other components (even the custom ones) except here
Anyone that is using lovelace and looking for this card (as it is deprecated) you might want to take a look at this card:
It pretty much does the same thing and imho even better.
1 Like
Or these drop-in replacements:
bit the bullet and transforming my HA Tiles to the new custom-tiles card for Lovelace by @rodrigodf . A lot of hard work went into the old tiles, so I am a bit careful…
seems to go well for now, there are some peculiarities, but up to now Ive been able to mitigate these with little ‘hacks’ which the plethora of possibilies of this new card holds.
One thing however won’t go, and for this I ask some assistance…
I have a set of tiles where in the previous setting, an icon would be placed next to the label. If one needed the label to go under the icon, use label_sec.
In the new custom card, using both label and icon, places the label above the icon, and, in this specific card, outside of the Tile:
old Tiles (note, this is already the lovelace tiles card):
- entity: group.plafond_spots_woonkamer
label_template: >
if (entities['sensor.spots_badge'].state !== 0) return 'Total Spots on: ' + entities['sensor.spots_badge'].state;
return 'No Spots on';
icon_template: >
if (state === 'on') return 'mdi:spotlight-beam';
return 'mdi:spotlight-beam';
style_template: >
if (state == 'on') return '--tiles-icon-color: #555B65';
return '--tiles-icon-color:#5daf35';
color_on: '#5daf35'
text_color_off: '#5daf35'
column: 1
column_span: 6
row: 1
row_span: 1
and
- entity: light.hue_ambiance_spot_1
label: ' 1'
icon: mdi:grid
style_template: >
if (state == 'on') return '--tiles-icon-color: #555B65';
return '--tiles-icon-color:#F0C209';
column: 1
column_span: 1
row: 4
row_span: 1
new card:
templates:
label: >
if (entities['sensor.spots_badge'].state !== 0) return 'Total Spots on: ' + entities['sensor.spots_badge'].state;
return 'No Spots on';
icon: >
if (state === 'on') return 'mdi:spotlight-beam';
return 'mdi:spotlight-beam';
style: >
if (state == 'on') return '--tiles-icon-color: #555B65;background-color:#5daf35';
return '--tiles-icon-color:#5daf35;--tiles-label-color:#5daf35';
column: 1
column_span: 6
row: 1
row_span: 1
and
- entity: light.hue_ambiance_spot_1
label: ' 1'
icon: mdi:grid
column: 1
column_span: 1
row: 4
row_span: 1
templates:
style: >
if (state == 'on') return '--tiles-icon-color: #555B65';
return '--tiles-icon-color:#F0C209';
please have a look what I could try, or maybe @rodrigodf would know, or maybe change this in the current card, so it will become possible again… It was there, and it is deeply missed…
the placement of the larger tiles is correct, using label_sec.
next to reinstalling above functionality, might I suggest a templating option for the card_settings, a templatable Title:
type: custom:tiles-card
card_settings:
templates:
title: >
'Mode selection: ' + entities['input_select.mode'].state;
Will see if I can file a request for that on the GitHub, thanks!