There are templates with mdi icon support planned for next release:
Add custom single icon chip card by CM000n · Pull Request #38 · UI-Lovelace-Minimalist/UI (github.com)
Hey!
I am completely new in themes etc. Just used the basic theme with iOS overlay before.
I followed the instructions and was abel to integrate the minimalist ui.
Now starting to try out my first views with chips, horizontal stacks etc.
But somehow it does not want to work 
Chips are not displayed etc. Only one button card will be displayed at all.
button_card_templates: !include_dir_merge_named minimalist-templates/
views:
- title: Minimalist
cards:
- type: horizontal-stack
cards:
- type: custom:button-card
template: edge
- type: custom:button-card
template: chip_temperature
variables:
ulm_chip_temperature_wohnzimmer: sensor.wohnzimmer_temperature_2
ulm_chip_temperature_flur: sensor.flur_temperature_2
- type: custom:button-card
template: edge
- type: horizontal-stack
cards:
- type: "custom:button-card"
template: card_title
name: Licht
- type: custom:button-card
template: edge
- type: "custom:button-card"
template: card_light
entity: light.esszimmer
- type: "custom:button-card"
template: card_light
entity: light.wohnzimmer
- type: custom:button-card
template: edge
so this produces this:
Nothing else
Instructions were basically clear, the only thin I coudnt figure out was this point:
- …
- Choose “Reload ressources” and afterwards “Refresh” to reload the page.
- …
I couldnt find the button to reload ressources. 
configuration.yaml:
# Enables the frontend
frontend:
themes: !include_dir_merge_named themes
lovelace:
mode: storage
dashboards:
lovelace-minimalist:
mode: yaml
title: Minimalist
icon: mdi:script
show_in_sidebar: true
filename: lovelace-minimalist.yaml
Anyone a hint where I took the wrong way?
Thanks in advance! (and sorry for basic beginner issue )
You have not configured a weather entity for template: chip_temperature. Is it possibly already because of that?
1 Like
you have to set a weather-entity and temperature-in/outside-sensor.
- type: 'custom:button-card'
template: chip_temperature
variables:
ulm_chip_temperature_inside: # <-- Sensor that shows your inside temp
ulm_chip_temperature_outside: # <-- Sensor that shows the outside temp
ulm_chip_temperature_weather: # <-- your weather entity
you just can´t rename the variables without changing the buttoncard-template.
1 Like
@mase @CM000n
Thanks for your answers! That definetly did the trick. Was not aware, that I cant rename it or delete specific templates.
1 Like
Does anybody know where to find the red/green shield emoji for the alarms?
Just cant figure this out: How can I switch between light and dark theme? Both modes are included in the
minimalist-desktop.yaml
and in the
minimalist-mobile.yaml
Open the settings (sidebar - username) and select Dark or Light - directly under the Theme selection:
sjabby / CM000n Simon - thank you very much!
1 Like
Made some navigation cards for my «home screen» with an extra sensor that gives me some extra information, like how many lights are on, is the door locked and alarm armed, set temp on climate and state of climate fan.
Template:
navigation_card_with_sensor:
color: var(--google-grey)
show_icon: true
show_label: true
show_name: true
styles:
icon:
- color: 'rgba(var(--color-blue),1)'
label:
- justify-self: start
- align-self: start
- font-weight: bold
- font-size: 12px
- filter: opacity(40%)
- margin-left: 12px
- color: 'rgba(var(--color-blue-text),1)'
name:
- align-self: end
- justify-self: start
- font-weight: bold
- font-size: 14px
- margin-left: 12px
- color: 'rgba(var(--color-blue-text),1)'
state:
- justify-self: start
- align-self: start
- font-weight: bold
- font-size: 12px
- filter: opacity(40%)
- margin-left: 12px
img_cell:
- background-color: 'rgba(var(--color-blue), 0.2)'
- border-radius: 50%
- place-self: center
- width: 42px
- height: 42px
grid:
- grid-template-areas: '"i n" "i l"'
- grid-template-columns: min-content auto
- grid-template-rows: min-content min-content
card:
- border-radius: var(--border-radius)
- box-shadow: var(--box-shadow)
- padding: 12px
- background-color: 'rgba(var(--color-background-blue), var(--opacity-bg))'
size: 20px
name: '[[[ return variables.navigate_name ]]]'
label: '[[[ return states[variables.navigate_sensor].state ]]]'
tap_action:
action: navigate
navigation_path: '[[[ return variables.navigate_path ]]]'
Yaml:
- type: 'custom:button-card'
template: navigation_card_with_sensor
variables:
navigate_name: Lys
navigate_path: lys
navigate_sensor: "sensor.lights_on"
icon: mdi:ceiling-light
- type: 'custom:button-card'
template: navigation_card_with_sensor
variables:
navigate_name: Ventilasjon
navigate_path: ventilasjon
navigate_sensor: "sensor.climate"
icon: mdi:hvac
- type: 'custom:button-card'
template: navigation_card_with_sensor
variables:
navigate_name: Dør og alarm
navigate_path: alarm
navigate_sensor: "sensor.door_and_alarm"
icon: mdi:alarm-panel
PROBLEM:
Only problem I have is that i have to reload the page for the sensors in on the card to update, even though the sensors are updated. Any idea how to solve this?
2 Likes
Hi guys,
this is truly a great project! I’ve been tinkering with it my self, gathering shared code from here and added some of my own.
I’m using the UI with auto-entities, decluttering card and swipe-card to enable a better experience.
But I’ve run into a problem: When using swipe-card (fork from postlund for touch prevention) I’m getting these weird effect on my card, only when using mobile. This happens when I swipe and only goes away on page refresh.
Does anyone have any advise?
1 Like
Digging into the chips I saw the triggers_update, and that worked 
navigation_card_with_sensor:
triggers_update: all
2 Likes
No. I have sent a pm, but no reply.
These are the default mdi:icons (search for shield) but with a color applied to them.
Here is my alarm status chip code:
chip_alarm:
template: chips
entity: alarm_control_panel.home_alarm
show_icon: true
icon: >
[[[
var alarm = states['alarm_control_panel.home_alarm'].state;
if (alarm === 'disarmed') return 'mdi:shield-off';
if (alarm === 'armed_home') return 'mdi:shield-home';
if (alarm === 'armed_away' || alarm === 'arming') return 'mdi:shield-check';
return 'mdi:shield-alert';
]]]
state:
- value: 'disarmed'
styles:
icon:
- color: rgba(var(--color-green), 1)
- value: 'triggered'
styles:
icon:
- color: rgba(var(--color-yellow), 1)
- animation: blink 2s ease infinite
- operator: 'default'
styles:
icon:
- color: rgba(var(--color-red), 1)
size: 80%
styles:
grid:
- grid-template-areas: '"i"'
Hopefully this can give you some inspiration for your own cards 
3 Likes
Any help, why Media Player Card (with controls) is not working?
- title: Musik
cards:
- type: 'custom:button-card'
template: chip_back
variables:
ulm_chip_back_path: /lovelace-minimalist/0
- type: horizontal-stack
cards:
- type: custom:button-card
template: edge
- type: "custom:button-card"
template: card_title
name: Musik
- type: custom:button-card
template: edge
- type: horizontal-stack
cards:
- type: custom:button-card
template: edge
- type: custom:button-card
template: card_media_player_with_controls
variables:
ulm_card_media_player_with_controls_entity: media_player.wohnzimmer
ulm_card_media_player_with_controls_name: Sonos Wohnzimmer
- type: custom:button-card
template: edge
Results in:
Seems to be because of a typo in the card_media_player_with_controls template. If you open button_card_templates.yaml you can try and fix it by changing:
entity_id: '[[[ return entity.ulm_card_media_player_with_controls_entity ]]]'
to:
entity_id: '[[[ return variables.ulm_card_media_player_with_controls_entity ]]]'
2 Likes
I changed it but it didnt help
Now the button_card_templates.yaml looks like this:
card_media_player_with_controls:
variables:
ulm_card_media_player_with_controls_name: "No name set"
triggers_update:
- "[[[ ulm_card_media_player_with_controls_entity ]]]"
styles:
grid:
- grid-template-areas: '"item1" "item2"'
- grid-template-columns: 1fr
- grid-template-rows: min-content min-content
- row-gap: 12px
card:
- border-radius: var(--border-radius)
- box-shadow: var(--box-shadow)
- padding: 12px
custom_fields:
item1:
card:
type: 'custom:button-card'
template:
- ulm_language_variables
- card_media_player
tap_action:
action: more-info
entity: '[[[ return variables.ulm_card_media_player_with_controls_entity ]]]'
name: '[[[ return variables.ulm_card_media_player_with_controls_name ]]]'
styles:
card:
- box-shadow: none
- padding: 0px
item2:
card:
type: 'custom:button-card'
template: list_items
custom_fields:
item1:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: media_player.media_previous_track
service_data:
entity_id: '[[[ return variables.ulm_card_media_player_with_controls_entity ]]]'
icon: 'mdi:skip-previous'
item2:
card:
type: 'custom:button-card'
template: widget_icon
entity: '[[[ return variables.ulm_card_media_player_with_controls_entity ]]]'
tap_action:
action: call-service
service: media_player.media_play_pause
service_data:
entity_id: '[[[ return variables.ulm_card_media_player_with_controls_entity ]]]'
icon: 'mdi:pause'
state:
- value: paused
icon: 'mdi:play'
- value: 'off'
icon: 'mdi:play'
item3:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: media_player.media_next_track
service_data:
entity_id: '[[[ return variables.ulm_card_media_player_with_controls_entity ]]]'
icon: 'mdi:skip-next'
(only for the part with card_media_player_with_controls) template.
Did you click Refresh in the menu under the 3 dots in upper right?