Is it possible to style these fields?

[sddgit]

I’m trying to find a way to do a couple of things with this card:

1. Change the background colour, so that the “unfilled” part of the card isn’t plain white or black. I’d like it to be more in keeping with my theme.

2. Change the size of the font used, which is just too big sometimes if you have a few of the cards in, say, a horizontal stack.

I’ve tried adding card-mod styling by having the following:

type: custom:bignumber-card
entity: sensor.mqtt_consumption
title: Consumption
scale: 40px
min: 0
max: 18000
hideunit: false
from: bottom
severity:
  - value: 2000
    bnStyle: var(--label-badge-green)
  - value: 4000
    bnStyle: var(--label-badge-yellow)
  - value: 18000
    bnStyle: var(--label-badge-red)
    color: '#FFFFFF'
card_mod:
  style: |
    ha-card {
      background: var(--ha-card-background);
      font-size: 15px;
      }

The card is then coloured differently, and according to my theme, but there are no longer any severity bars. And it doesn’t seem to matter what I have for font-size, it doesn’t change. Things like font-weight do work though. Appreciate any pointers.

[PulsarFX]

try this for the value field:

style: |
  #value {
    font-size: 12px;
  }

the complete path is

<ha-card class="type-custom-bignumber-card">
  <div id="value">21.46<small>°C</small></div>
  <div id="title">Temp</div>
</ha-card>

[IzanagiOne]

You're a star @PulsarFX, that works perfectly. This had been driving me nuts !!!!