Skip to content

Home Assistant Lovelace custom card with Barometer, Thermomer themes and customs themes as well !

Notifications You must be signed in to change notification settings

SNoof85/lovelace-tempometer-gauge-card-deprecated

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

93 Commits
 
 
 
 
 
 

Repository files navigation

End Of Life

As you can see in issues, I don't take too much time to answer to every needs, because lack of time / skill ! There won't be any updates from now. I will remove the card from HACS default, you will still be able to use it with HACS custom repository.

Lovelace tempometer-gauge-card

A Home Assistant lovelace custom gauge card for barometer, thermometer, humidity meter or anything you want with custom icons.

pressure-and-temp humidity-and-custom

Usage

Add this card via HACS (recommended)

Or manually : Add this custom card to your home assistant instance. Reference it into your lovelace configuration.

  - type: js
    url: /local/lovelace/tempometer-gauge-card.js

Finally : Add it as a custom card to your lovelace : 'custom:tempometer-gauge-card'.

Note : This card is made for a full row, don't try to put it in a grid or horizontal stack, it will look bad. I won't fix this.

Options

Card options

Option Type Description
entity (required) string The entity to track. Can be followed by an attribute to track entity.attribute)
min (required) number The gauge's minimum value
max (required) number The gauge's maximum value
entity_min string The entity that define the minimum reached. Can be followed by an attribute to track entity.attribute) (you have to create this entity, the card will not compute it !)
entity_max string The entity that define the maximum reached. Can be followed by an attribute to track entity.attribute) (you have to create this entity, the card will not compute it !)
title string Card title to show.
card_style string Set this to thermometer, humidity or custom to change icons. (Default will be barometer theme, custom will need icon1, icon2, icon3 !)
measurement string Custom unit of measurement
icon1 string Icon on left side in custom style.
icon2 string Icon on center in custom style.
icon3 string Icon on right side in custom style.
icon_color string Icon Color (Default var(--paper-item-icon-color))
severity severity object Severity map to change the gauge color.
decimals number Decimal precision of entity value.

Severity object

Option Type Description
green (required) number Value for the color green.
yellow (required) number Value for the color yellow.
red (required) number Value for the color red.
max number Maximum value of the last step, normal color will be rendered above

Example:

severity:
  green: 1020
  yellow: 1000
  red: 900
  max: 1100

Tip

The maximum and minimum bounds have a hover tooltip with their own values.

Full examples

type: 'custom:tempometer-gauge-card'
entity: sensor.barometer
min: 980
max: 1050
entity_min: sensor.barometer_min_this_week
entity_max: sensor.barometer_max_this_week
title: Barometer
decimals: 0
severity:
  green: 1020
  yellow: 1000
  red: 900
type: 'custom:tempometer-gauge-card'
entity: sensor.temperature
min: 15
max: 30
entity_min: sensor.temperature_min_this_week
entity_max: sensor.temperature_max_this_week
title: Thermometer
card_style: thermometer
severity:
  green: 22
  yellow: 24
  red: 27
type: 'custom:tempometer-gauge-card'
entity: sensor.power
min: 0
max: 4000
entity_min: sensor.power_min_this_week
entity_max: sensor.power_max_this_week
title: Power Meter
card_style: custom
icon1: mdi:flash-off
icon2: mdi:flash-outline
icon3: mdi:flash
severity:
  green: 1000
  yellow: 2000
  red: 3000
  max: 5000

Maybe more to come ! PR are welcome and i can have a look to features requests.