Display gauge for variable temperatures at different times

Configuration Frontend
1

Evening everyone,

I have a confusing request which I’m sure can be done, but I’m not sure I know how to explain the requirements!

We have a vivarium with a Red Footed Tortoise. I currently use a temperature and humidity sensor to display a basic gauge as per the photo.

Screenshot 2025-11-13 184130
Screenshot 2025-11-13 184130408×186 18.5 KB

The tortoise has different temperature requirements for different times of day as follows:

  • Basking Area Temp 32-35 degrees celcius
  • Ambient/cool zone 24-29 degrees celcius
  • Nighttime Temperature 20-23 degrees celcius

The ambient/cool zone needs a seperate sensor as I’ve just realised, but how can I display the temperature range for different temperatures at night?

I also really dislike the design of the built-in colour scale as it has no gradient and looks too ‘in your face’. Is there a nicer design with a gradient colour scale I can use?

Many thanks in advance.
Bret

2

Sorry, just to add - humidity is always the same so this could be shown as a dual needle on one of the gauges maybe?

3

There are custom cards that allow gradients like:

These both allow stacking multiple arcs, so you could have basking, ambient, and or nightime combined in whatever way you want. I don’t know of any that allows templating the segment object. Your best best might be to use conditional cards to determine what is displayed at any given time.

1 Like
4

Hey!

Thank you so much for this, I will have a look. I’ve already added the first one.

I’ve made conditional badges for my smoke alarms based the entity state but I couldn’t see a way to do conditions based on time. I will have a search.

Thanks again,
Bret

5

That really depends on what you need, one option for day/night would be something based on sun.sun… either directly on its state or on the elevation attribute. Another option would be to set up a Times of the Day Sensor Helper and use its state as your condition.

6

Doesn’t look like you can use templates for the segement boundaries in the Gauge Card Pro.

It seems to work, though, if you ‘wrap’ it into a custom config-template-card; this is just a ‘quick and dirty’ adoption of what works in the gauge card as well - with the drawback that it also ‘flickers’ every few seconds:

type: custom:config-template-card
variables:
  BBTempRight: states['input_number.grill_alert_low'].state
  BBTempHigh: states['input_number.grill_alert_high'].state + 2
entities:
  - sensor.igrill2_ambient_temp
card:  
  type: custom:gauge-card-pro
  use_new_from_segments_style: true
  segments:
    - from: 0
      color: blue
    - from: ${BBTempRight}
      color: green
    - from: ${BBTempHigh}
      color: red
  needle: true
  gradient: false
  gradient_resolution: medium
  entity: sensor.igrill2_ambient_temp
  min_indicator:
    type: number
    value: 0
  max_indicator:
    type: number
    value: 525
  titles:
    primary: Ambient
  icon:
    type: battery
    value: sensor.igrill2_battery
  min: 0
  max: 525

This allows me to adjust the input_number.grill_alert_low and input_number.grill_alert_high via script/automation and the gauge card adjusts automatically.