How can I change the font/font size for the units?

Need Help :slight_smile:

I just want to reduce the font size of the displayed unit in a custom:button-card

type: custom:button-card

My configuration:

entity: sensor.total_dc_power
layout: icon_name_state2nd
name: Solar
icon: kuf:weather_sun
show_state: true
units: W
- height: null
- border-radius: 0%
- background-color: transparent
- font-family: kanit-thin
- font-size: 25px
- font-weight: bold
- color: grey
- color: grey
- font-family: next-art
- font-size: 50px
- font-weight: bold
- color: grey
- size: 10px

Welcome to the forum. A couple of points…

Please post your code using the community standards. See #11, but please read the other points as well.

There is large thread for custom:button-card here

This is controlling the font size of the state


reduce it to something like - font-size: 20px

and thank you
for your reply.
I have already used this solution, but it changes the entire display.
I just want to change the size of the unit.
I don’t have an idea for that yet

Thanks anyway !

@ulitrommer Did you find a solution for changing just the size of the units text? Thx.

units: <span style=“font-size:18px”> w</span>

Thanks for the response. Unfortunately while it does override the displayed units, the font-size did not change and remained the same as the state itself.

Hi, it’s working for me, maybe is your theme. If you change the font-size number the W keeps the size? English is not my language and maybe I do not understand well, do you wanna change the size of the numbers or the W?