Scale Picture Card Elements

Good night people!
Help me please!
I don’t know how to make Picture Card Elements smaller.
What I want is to create a type of level for a water tank. The size is too big.
How do I scale?
Thanks.

See below, using style: to position and scale it

- type: image
    entity: light.workshop_light
    image: /local/images/icons8-light-off-100.png
    style:
      top: 21%
      left: 10%
      width: 12%

Friend, thanks for the help but, I’m starting and I really appreciate the help!
I couldn’t solve my problem with the tip you gave me, I couldn’t implement it…
below my script:

cards: null
entity: input_number.slider_control
name: hallway light
type: entity-image
show_status: true
state_image:
‘40.0’ : /local/nv1.png
‘41.0’ : /local/nv2.png
‘42.0’ : /local/nv3.png
‘43.0’ : /local/nv2.png
‘44.0’ : /local/nv5.png
‘45.0’ : /local/nv6.png
‘46.0’ : /local/nv7.png
‘47.0’ : /local/nv8.png
‘48.0’: /local/nv9.png
‘49.0’ : /local/nv10.png
the idea is according to the value received from the sensor, load an image.
If you can help me with this I would be very grateful.

Can you format your code it’s hard to read like thst

type: picture-elements
image: /local/tv.jpg
elements:
  - type: custom:button-card
    color_type: card
    entity: sensor.temp_srednia
    show_icon: false
    name: '[[[ return entity.state  ]]]'
    state:
      - value: 26
        operator: '>'
        color: rgb(255,0,0)
      - value: 24
        operator: '>'
        color: rgb(223,0,31)
      - value: 22
        operator: '>'
        color: rgb(191,0,63)
      - value: 20
        operator: '>'
        color: rgb(159,0,95)
      - value: 18
        operator: '>'
        color: rgb(127,0,127)
      - value: 16
        operator: '>'
        color: rgb(95,0,159)
      - value: 14
        operator: '>'
        color: rgb(63,0,191)
      - value: 12
        operator: '>'
        color: rgb(31,0,223)
      - value: 10
        operator: '>'
        color: rgb(0,0,255)
      - operator: default
        color: black
    style:
      left: 48%
      top: 36%
      width: 30%

type: picture-elements
image: /local/parter.png
elements:
  - type: image
    entity: weather.pogoda
    show_state: false
    show_name: false
    state_image:
      clear-night: /local/weather/clear-night2.png
      cloudy: /local/weather/cloudy.gif
      exceptional: /local/weather/exceptional.png
      fog: /local/weather/fog3.gif
      hail: /local/weather/hail2.gif
      lightning: /local/weather/lightning3.gif
      lightning-rainy: /local/weather/lightning-rainy.jpeg
      partlycloudy: /local//weather/partly-cloudy.gif
      pouring: /local/weather/pouring.gif
      rainy: /local/weather/rainy.gif
      snowy: /local/weather/snowy.gif
      snowy-rainy: /local/weather/snowy-rainy.gif
      sunny: /local/weather/sunny.gif
      windy: /local/pweather/windy.gif
      windy-variant: /local/weather/windy.gif
    style:
      top: 50%
      left: 50%
      width: 30%

1 Like

Thank you friend, I appreciate your patience is that I’m still learning. With your help I will get there!
Strong hug!

1 Like

Ball show, it worked!
Thank you so much, I was almost giving up…
I will use your code as a knowledge base.