Example 4: More Environment sensor cards¶

How to¶

The lux card on the second row is available as tutorial #3.

In this tutorial you learn how to recreate that specific card.

Visualization¶

Once again a visualization of sensors values using two completely different card designs. The first row is a Neumorphic design, and the second implements a very simple and clean Flat design with a few colored blocks as the background of the card.

Interactions¶

• All tools support by default the "more-info" dialog once clicked.

Used Home Assistant Integrations¶

• Aqara Zigbee sensors with temperature, humidity and pressure data using zigbee2mqtt, ie the MQTT integration

How to make it work in your own installation¶

All cards¶

Required Home Assistant Integrations
The visualization is build on temperature, humidity and lux entities. It does not depend on any specific integration.

Required Home Assistant Entity Changes
You can replace the existing temperature, humidity and lux entities with any sensor entity.

View and Card Configuration¶

Lovelace view¶

First row of cards

The first row shows cards with a Neumorphic design with:

• Icon in the top-left corner
• Segmented Arc with humidity template colorstop and scale
• State with unit of measurement
• Name of the entity
• State history over the last 24 hours

Second row of cards

The first row shows cards with a simple Flat design with:

• 4 rectangles forming the background of card
• State with unit of measurement
• A vertical line as a divider
• Icon of the entity
• Name of the entity
• State history over the last 24 hours

Decluttering templates¶

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

- type: horizontal-stack
  cards:
    - type: custom:decluttering-card
      template: sak_arc180_sparklinebar24_template_tpl
      variables:
        - entity: studym_iaq_humidity
        - name: 11Ta Study Back
        - decimals: 0
        - scale_min: 0
        - scale_max: 100
    - type: custom:decluttering-card
      template: sak_arc180_sparklinebar24_template_tpl
      variables:
        - entity: hall_gf_iaq_humidity
        - name: 11Tb Hall
        - decimals: 0
        - scale_min: 0
        - scale_max: 100
    - type: custom:decluttering-card
      template: sak_arc180_sparklinebar24_template_tpl
      variables:
        - entity: bedroom_iaq_humidity
        - name: 11Tc Bedroom
        - decimals: 0
        - scale_min: 0
        - scale_max: 100

SAK templates¶

The following templates are defined in the /lovelace/sak_templates/sak-templates.yaml file:

• The toolset_arc180_sparklinebar24 is the template used for the first row of cards

Remarks¶

None.

← Internal References →