MiFlora Sensor Plant Database


Any success with irrigation system integrated into HASS? I’d like to build similar thing. Would you be able to share your hardware setup details?


Do you have a small overview what you changed? Just out of curiousity.

@jones Would you mind sending me another link to the data.js file? Much appreciated

Please… If you have persistent storage upload it there. Mega, Google Drive or else. I don’t use any of these services: https://we.tl/t-skoDUoV7ck

That is something that annoys me as well. Not really looked into it yet to be honest.

My idea in the long run with this card was to add:

  • Variable notification service for when it is the right time to give the “exact” amount of water, nutrition, etc… based on miscellaneous additional parameters (time of year, humidity, temperature, location, etc., etc…).
  • Holiday notification service + various additional cards. When I’m on a holiday that any of my neighbours, friends, family can take care of my plants as well without guessing what amount and when exactly to give water.
  • Bugs fixes, e.g. the double naming
  • Github issue list
  • HACS integration

For now I’ve postponed it given the pending crises with China and the economic meltdown worldwide. My priorities has shifted quite a bit.

Are anybody else having issues with the card not showing up after latest upgrade? It looks like I have completed everything correctly, but the card is just empty, when I add a custom card manually…

It seems as if quotes in the plant’s species: doesn’t work anymore. So open the data file, then search for your plants, and remove ' ' characters from the first instance (before the square brackets).

My set-up:

  • modified flower-card.js to point to correct folders: https://github.com/tbrasser/lovelace-flower-card
  • used convert.py on the database file
  • removed the ' characters from the name of the plants that I have in data.js. (only on the first occurrence, before the [ ] part.
  • put both flower-card.js and data.js in /config/www/community/flower-card/
  • put plant images in /config/www/images/plants/ (also modify these filenames to remove the ')
  • add resource from the ui: /hacsfiles/flower-card/flower-card.js (js module)

I used the following code in lovelace (styling because I use HKI):

- entity: plant.miflora1
  species: dracaena fragrans massangeana
  type: custom:flower-card
  style: |
      ha-card {
        border-radius: {{ states('input_select.border_radius_selector') }};
        box-shadow: var(--box-shadow);
        font-family: Helvetica;
        font-size: 12px;
        opacity: 0.8;
- type: custom:flower-card
  entity: plant.miflora2
  species: dracaena marginata
  style: |
      ha-card {
        border-radius: {{ states('input_select.border_radius_selector') }};
        box-shadow: var(--box-shadow);
        font-family: Helvetica;
        font-size: 12px;
        opacity: 0.8;


p.s. yes, my so is in charge of naming plants :wink:

p.p.s you can find the database and images in this thread, and also in the README of the repo’s linked.


Really liking this card! Has anyone successfully used their own images? Struggling to get the correct sizing.

I have tried several times to convert the file but I am unable to. Could an already converted data.js be uploaded directly to the repo?

python3 convert.py PlantDB_5335_U0.csv > data.js

1 Like

I would really need data from a plant. For data as in the table. Name of the plant: Jiaogulan, Gynostemma pentaphyllum. LUX MIN LUX MAX TEMPERATURE MIN TEMPERATURE MAX. Thanks !!!

Don’t know about the uploading to the repo but i’ve just converted the CSV by changing the line

with open(filename') as csvfile:
with open(filename, encoding='UTF8') as csvfile:
in convert.py, someone feel free to make this a pull on github, i don’t have an account there.

Anyway, I also have a non expiring link on my own file storage for those of you who don’t care to convert it yourselves.


I’m happy to do the PR. I’ll see what I can do.

EDIT: PR done

Thanks @PHiAX for your work



type: 'custom:flower-card'
entity: plant.sempervivum
species: sempervivum tectorum


      moisture: sensor.flower_white_m
      temperature: sensor.flower_white_t
      conductivity: sensor.flower_white_c
      brightness: sensor.flower_white_l

Screenshot 2020-07-03 at 18.15.57

Why does the card display no image

browser cache needed clearing.

I’m trying to set this card up and installed this version in HACS but am getting the below error., even after a hard cache refresh

Which version / fork of the card are people using?

Just tried this version as well. This time I looked in the Chrome dev console and saw this:


I’m using the original repo but without HACS.

folder structure as follows

| card-tools.js
| flower-card.js
               data.js <--- converted file from earlier post

Lovelace resources loaded from GUI with paths /local/card-tools.js and /local/flower-card.js

edit: Come to think of it, I did restart my HA instance completely.
edit 2: I’ve now switched to the repo from post 85 MiFlora Sensor Plant Database and that also seems fine.

Hi guys,

I created free cloud Plants DB which can be used by community. Please take a look.


I think I found the problem, since I was stuck where you were. In the .js file, is always making reference to /local/lovelace-flower-card/data/data.js

I you install everything via hacs, you need to change the local references to /hacsfiles/lovelace-flower-card/data/data.js

To do this You need to edit the flower-card.js file.
Change line 163 to: <span id="name"> ${this.stateObj.attributes.friendly_name}</span>
Save the file and most probably refresh your browser’s cache.

Hi all,

Just forked this repo, made it installable with HACS, removed the hassle of installing dependencies and removed the step with running convert.py.

Here it is: https://github.com/Yolandavdvegt/lovelace-flower-card