Skip to content

Example 4: More Environment sensor cards

AmoebeLabs Swiss Army Knife Custom Card Example 4 - More sensors

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

file location included from
view-sake4.yml /lovelace/views sak-examples-dashboard.yaml

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

The first row of cards uses a decluttering template...

  • The sak_arc180_sparklinebar24_template_tpl is used for displaying these cards
From: view-sake4.yaml
 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 →

Back to top