A custom Lovelace card that displays the PM (2.5 or 10) index and risk level in Home Assistant.
The card was copied from the uv-index-card. Big thank you @t1gr0u for allowing me to copy and adapt the card.
HACS (Home Assistant Community Store)
- Go to HACS page on your Home Assistant instance
- Select
Frontend
- Press add icon and search for
pm-index
- Select PM Index Card repo and install
- Force refresh the Home Assistant page (Ctrl + F5)
- Add pm-index-card to your page
- Download the 'pm-index-card.js' from the latest release (with right click, save link as)
- Place the downloaded file on your Home Assistant machine in the
config/www
folder (when there is nowww
folder in the folder where yourconfiguration.yaml
file is, create it and place the file there) - In Home Assistant go to
Configuration->Lovelace Dashboards->Resources
(When there is noresources
tag on theLovelace Dashboard
page, enable advanced mode in your account settings, and retry this step) - Add a new resource
- Url =
/local/pm-index-card.js
- Resource type =
module
- Url =
- Force refresh the Home Assistant page (Ctrl + F5)
- Add pm-index-card to your page
- Add the card with the visual editor
- Or add the card manually with the following (minimal) configuration:
type: custom:pm-index-card
entity: sensor.pm_2_5
type: custom:pm-index-card
entity: sensor.pm_2_5
Name | Type | Requirement | Description | Default |
---|---|---|---|---|
type | string | Required | custom:pm-index-card |
|
name | string | Optional | Card name | PM Index |
show_error | boolean | Optional | Show what an error looks like for the card | false |
show_warning | boolean | Optional | Show what a warning looks like for the card | false |
pm_10 | boolean | Optional | Use pm 10 (true) or 2.5 (false) index scala | false |
show_recommendation | boolean | Optional | Show health description | true |
entity | string | Required | Home Assistant entity ID. | none |
language | string | Optional | The 2 character that determines the language | en |
tap_action | object | Optional | Action to take on tap | action: more-info |
hold_action | object | Optional | Action to take on hold | none |
double_tap_action | object | Optional | Action to take on double tap | none |
Name | Type | Requirement | Description | Default |
---|---|---|---|---|
action | string | Required | Action to perform (more-info, toggle, call-service, navigate url, none) | more-info |
navigation_path | string | Optional | Path to navigate to (e.g. /lovelace/0/) when action defined as navigate | none |
url | string | Optional | URL to open on click when action is url. The URL will open in a new tab | none |
service | string | Optional | Service to call (e.g. media_player.media_play_pause) when action defined as call-service | none |
service_data | object | Optional | Service data to include (e.g. entity_id: media_player.bedroom) when action defined as call-service | none |
haptic | string | Optional | Haptic feedback success, warning, failure, light, medium, heavy, selection | none |
repeat | number | Optional | How often to repeat the hold_action in milliseconds. |
none |
The following languages are supported:
Language | Yaml value | Supported | Translated by |
---|---|---|---|
English | en |
v1.0.0 | @MelleD |
German | de |
v1.0.0 | @MelleD |
If you wish to add a language please follow these steps:
- Go into the
src/localize/languages/
folder - Duplicate the
en.json
and name it as the language that you would like to add by following the 2 characters ISO language code - Then modify the
localize.ts
file, located insrc/localize/
to include your language file. - Update the
Readme.md
, found insrc/
to include your language and your Github username in the language table.
- @t1gr0u for the uv-index-card, which I copied and adapted. I really like the card and use it for my UV Index.
Clone and create a PR to help make the card even better.
Please ⭐️ or sponsor this repo when you like it.