Hi, is anyone aware of a weather card that can display temperatures in Fahrenheit and Celsius at the same time? Or if not any other project/advice that makes displaying both easier?
Any help is appreciated!
Thanks,
Julian
What card are you currently using?
You may be able to simply use card_mod to add an additional field/sensor if there isn’t a dual sensor card available.
1 Like
Just the regular weather-forecast card. I have a look into card_mod. Thank youi
Something like this…
type: weather-forecast
entity: weather.forecast_home
forecast_type: daily
card_mod:
style: |
.temp-attribute .temp::after {
content: "{{ ((state_attr('weather.forecast_home','temperature')-32)/(9/5))| round(0)}}°C";
position: absolute;
right: 110%;
color: blue;
}
1 Like
Thanks @LiQuid_cOOled
Do you know if there’s a way to make the hourly also C and F?
Thanks!
Yes but it would require:
- Adding an hourly weather template sensor
- Isolating the hour temp element in the card
What weather integration are you using ( Accuweather, Meteorologisk institutt )?
It would look something like this 
Here is one method using data from the Meteorologisk institutt weather intergration.
show_current: true
show_forecast: true
type: weather-forecast
entity: weather.forecast_home
forecast_type: hourly
secondary_info_attribute: wind_speed
card_mod:
style: |
.temp-attribute .temp::before {
content: "{{ ((state_attr('weather.forecast_home','temperature')-32)/(9/5))| round(0)}}°C /";
margin-left: -20px !important;
}
.forecast div.temp:nth-child(3){
font-size: 13px;
}
.forecast>div:nth-child(1)>div:nth-child(3)::after{
content: "/ {{ ((state_attr('sensor.weather_hourly','forecast')[0]['temperature']-32)/(9/5))| round(0)}}°C";
}
.forecast>div:nth-child(2)>div:nth-child(3)::after{
content: "/ {{ ((state_attr('sensor.weather_hourly','forecast')[1]['temperature']-32)/(9/5))| round(0)}}°C";
}
.forecast>div:nth-child(3)>div:nth-child(3)::after{
content: "/ {{ ((state_attr('sensor.weather_hourly','forecast')[2]['temperature']-32)/(9/5))| round(0)}}°C";
}
.forecast>div:nth-child(4)>div:nth-child(3)::after{
content: "/ {{ ((state_attr('sensor.weather_hourly','forecast')[3]['temperature']-32)/(9/5))| round(0)}}°C";
}
.forecast>div:nth-child(5)>div:nth-child(3)::after{
content: "/ {{ ((state_attr('sensor.weather_hourly','forecast')[4]['temperature']-32)/(9/5))| round(0)}}°C";
}
To get hourly data you’ll need to create a template sensor that contains the hourly forecast.
A Template Example
-
You can define the sensor’s state to your liking. The attributes define the hourly data.
-
The
datetime:attribute will show the date/time in UTC and most likely will not match your displayed system date/time .
- trigger:
- platform: time_pattern
hours: /1
- platform: homeassistant
event: start
action:
- service: weather.get_forecasts
data:
type: hourly
target:
entity_id: weather.forecast_home
response_variable: hourly
sensor:
- name: Weather Hourly
state: "{{ '%d:%02d%s' %((now().hour) % 12,now().minute,' AM' if now().hour< 12 else ' PM')}}"
attributes:
temperature: "{{ state_attr('weather.forecast_home','temperature')}}"
forecast: "{{ hourly['weather.forecast_home'].forecast }}"
1 Like
Yo! Sharing a card-mod method that accomplishes thisIn case you’re using pkissling’s clock-weather-card and come across this post:
Step 1 – Create sensor that stores calculated temp in °C
Go to Helpers > Create > Template > Sensor
Name it “secondary weather temperature”
Use this template, be sure to sub in your weather entity in the < carrots >.
{% set fahrenheit = state_attr('weather.thegoonies', 'temperature') | float %}
{% if fahrenheit is defined and fahrenheit != 0 %}
{{ ((fahrenheit - 32) * 5 / 9) | round(1) }}
{% else %}
N/A
{% endif %}
Step 2 – Inject subtitle with your °C value using card-mod
Confirm that this template renders correctly in developer tools > templating:
{{ states('sensor.secondary_weather_temperature') }}°{{ 'F' if
is_state_attr('weather.<< your entity here >>', 'temperature_unit', '°C') else 'C' }}
The resulting sensor should output your current temperature in c.
Append your lovelace card with this modification, substituting your correct entities:
card_mod:
style: |
:host {
--dual-temp: "{{ states('sensor.secondary_weather_temperature') }}°{{ 'F' if is_state_attr('weather.< your entity here >', 'temperature_unit', '°C') else 'C' }}";
}
clock-weather-card-today-right-wrap-top:after {
content: var(--dual-temp);
display: block;
}
If done correctly, your card should now show both temps!
Note: It’s also possible to do this for each of the forecast rows though I personally didn’t like how it looked; too much of an eyechart and my family just wanted the at-a-glance current conversion.
1 Like