Alarm status as very clear message

Configuration Frontend
1

Hi,

I would like to visualize the status of my alarm based on status.
Like something large and Red when away armed or night armed and green(or white) when disarmed.

Any good ideas on how to do it?

2

What about the ha-alert for Markdown Card?

3

Thanks but I think I will try something out with 🔹 Card-mod - Add css styles to any lovelace card

4

I did it this way:

show_name: false
show_icon: true
type: button
style: |
  ha-card {
    border-radius: 0px;
    {% if is_state('alarm_control_panel.9000_aaa_zone_1_alarm', 'disarmed') %} 
      animation: none;
      --state-alarm_control_panel-disarmed-color: green;
    {% elif is_state('alarm_control_panel.9000_aaa_zone_1_alarm', 'armed_night') %} 
      animation: blink 1s linear infinite;
      background-color: red;
      --state-alarm_control_panel-armed_night-color: white;
    {% elif is_state('alarm_control_panel.9000_aaa_zone_1_alarm', 'armed_away') %} 
      animation: blink 1s linear infinite;
      background-color: red;
      --state-alarm_control_panel-armed_away-color: white;
    {% else %}
      none
    {% endif %}
  }
  @keyframes blink {
    50% {opacity: 0;}
    }
tap_action:
  action: none
entity: alarm_control_panel.9000_aaa_zone_1_alarm
icon: mdi:shield-home
show_state: false
hold_action:
  action: none
1 Like