Looking for suggestion: Solar Panel monitoring

I would like to recreate a dashboard like this in HomeAssistant:

It’s a Solar Energy monitoring app from Tigo, the panel colors show either energy or power produced.

I am looking for suggestions on an approach to implement a similar dashboard in HomeAssistant.

The best I’ve come up so far is a placing Gauges in a similar pattern, which isn’t ideal.

The requirements are, :

  1. Rectangular shape
  2. Color shading to show state (energy or power)
  3. Ability to position them ad-hoc around the page. - optional

Can anyone suggest an approach?

What about a picture entity card, then you can place images / elements anywhere you want. You can use an image or icon of your choice, text state and you can change the colour with the state_filter option

That’s a good tip. I can have a Photo of the rooftop. I don’t see a way to draw boxes to represent the panels… I can use an Image, but there’s not a good way to change the color of the images to represent energy, I don’t think.

Dynamically changing the color of a rectangle is the hard part I think.

You could use different colours rectangles and use state_image to change them based on state of a sensor