elements:
  - icon: 'mdi:fan'
    style:
      '--iron-icon-height': 45px
      '--iron-icon-width': 45px
      color: dodgerblue
      left: 10%
      opacity: 0.7
      top: 7%
    tap_action: none
    type: icon
  - entity: sensor.purifier_speed
    style:
      border-color: 'rgb(34, 154, 210)'
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      left: 6%
      opacity: 1
      pointer-events: none
      text-shadow: 1px 1px black
      top: 7%
      transform: 'translate(0%,-50%)'
    type: state-label
  - icon: 'mdi:water-percent'
    style:
      '--iron-icon-height': 45px
      '--iron-icon-width': 45px
      color: dodgerblue
      left: 10%
      top: 20%
    tap_action: none
    type: icon
  - attribute: humidity
    color_stops: null
    entity: fan.philips_airpurifier
    fill: 'rgba(0,0,0,0.3)'
    font_style:
      color: white
    gradient: true
    max: 100
    min: 0
    show_card: null
    stroke_width: 10
    style:
      height: 60px
      left: 10%
      top: 20%
      width: 60px
    type: 'custom:circle-sensor-card'
    units: '%'
  - icon: 'mdi:thermometer'
    style:
      '--iron-icon-height': 45px
      '--iron-icon-width': 45px
      color: dodgerblue
      left: 10%
      top: 35%
    tap_action: none
    type: icon
  - attribute: temperature
    color_stops: null
    entity: fan.philips_airpurifier
    fill: 'rgba(0,0,0,0.3)'
    font_style:
      color: white
    gradient: true
    max: 100
    min: 0
    show_card: null
    stroke_width: 10
    style:
      height: 60px
      left: 10%
      top: 35%
      width: 60px
    type: 'custom:circle-sensor-card'
    units: °C
  - icon: 'mdi:bug'
    style:
      '--iron-icon-height': 45px
      '--iron-icon-width': 45px
      color: dodgerblue
      left: 10%
      top: 50%
    tap_action: none
    type: icon
  - attribute: allergen_index
    color_stops: null
    entity: fan.philips_airpurifier
    fill: 'rgba(0,0,0,0.3)'
    font_style:
      color: white
    gradient: true
    max: 10
    min: 0
    show_card: null
    stroke_width: 10
    style:
      height: 60px
      left: 10%
      top: 50%
      width: 60px
    type: 'custom:circle-sensor-card'
  - entity: sensor.purifier_mode
    prefix: 'Mode: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-right-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      opacity: 0.8
      pointer-events: none
      right: 1%
      text-shadow: 1px 1px black
      top: 80%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_target_humidity
    prefix: 'Target humidity: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-right-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      opacity: 0.8
      pointer-events: none
      right: 1%
      text-shadow: 1px 1px black
      top: 85%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_water_level
    prefix: 'Water level: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-right-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      opacity: 0.8
      pointer-events: none
      right: 1%
      text-shadow: 1px 1px black
      top: 90%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_brightness
    prefix: 'Brightness: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-right-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      opacity: 0.8
      pointer-events: none
      right: 1%
      text-shadow: 1px 1px black
      top: 95%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_air_quality
    style:
      border-color: 'rgb(34, 154, 210)'
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 120%
      font-weight: bold
      left: 46%
      opacity: 1
      pointer-events: none
      text-shadow: 1px 1px black
      top: 22%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_pre_filter
    prefix: 'Pre-filter: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-left-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      left: 1%
      opacity: 0.8
      pointer-events: none
      text-shadow: 1px 1px black
      top: 80%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_wick_filter
    prefix: 'Wick filter: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-left-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      left: 1%
      opacity: 0.8
      pointer-events: none
      text-shadow: 1px 1px black
      top: 85%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_carbon_filter
    prefix: 'Carbon filter: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-left-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      left: 1%
      opacity: 0.8
      pointer-events: none
      text-shadow: 1px 1px black
      top: 90%
      transform: 'translate(0%,-50%)'
    type: state-label
  - entity: sensor.purifier_hepa_filter
    prefix: 'HEPA filter: '
    style:
      border-color: 'rgb(34, 154, 210)'
      border-left-style: solid
      color: 'rgb(255, 255, 255)'
      font-family: Trebuchet MS
      font-size: 90%
      font-weight: bold
      left: 1%
      opacity: 0.8
      pointer-events: none
      text-shadow: 1px 1px black
      top: 95%
      transform: 'translate(0%,-50%)'
    type: state-label
image: /local/images/purifier-image.png
type: picture-elements