Remove the background from the icon bubble card

[diablojeje91]

@[TheSpirit]
@TheSpirit

  .bubble-icon-container {
      background-color: rgba(255,255,255,0);!important;
  }

Please provide your YAML file

I’ve posted more than 3 messages on

Bubble Card - A minimalist card collection for Home Assistant with a nice pop-up touch

hi, i like the bubble cards very much, but i can not find out how to remove the grey background behind the trash can. [Bildschirmfoto 2026-03-28 um 09.42.55] tried with claude and gemini, but nothing worked. can someone help me? Thanks a lot

I can’t answer you there

[Sonikky]

This should do it:

.bubble-icon-container {background: none !important;}

[TheSpirit (Andreas)]

Sorry for not replying.
I tried

  .bubble-icon-container {
      background-color: rgba(255,255,255,0);!important;
  }

and

.bubble-icon-container {background: none !important;}

both did not work.
here is my code:

type: custom:bubble-card
card_type: button
button_type: state
name: " "
icon: mdi:trash-can-outline
show_icon: true
scrolling_effect: false
show_name: false
sub_button:
  main:
    - entity: sensor.abfall_naechster_restmuell
      show_name: false
      show_state: false
      show_last_changed: false
      show_attribute: true
      attribute: daysTo
      show_background: false
      show_icon: true
    - entity: sensor.abfall_naechster_gelbersack
      show_name: false
      show_state: false
      show_last_changed: false
      show_attribute: true
      attribute: daysTo
      show_background: false
      show_icon: true
    - entity: sensor.abfall_naechster_biotonne
      show_name: false
      show_state: false
      show_last_changed: false
      show_attribute: true
      attribute: daysTo
      show_background: false
      show_icon: true
    - entity: sensor.abfall_naechster_papier
      show_name: false
      show_state: false
      show_last_changed: false
      show_attribute: true
      attribute: daysTo
      show_background: false
      show_icon: true
  bottom: []
card_layout: large-2-rows
styles: |-
  .bubble-icon-container {
         background: none !important;
  }

  .bubble-sub-button-1 {
         color: grey !important;
  }       
  .bubble-sub-button-2 {
         color: goldenrod !important;
  }
  .bubble-sub-button-3 {
         color: #67ad5b !important;
  }
  .bubble-sub-button-4 {
         color: rgb(1, 122, 255) !important;
  }
tap_action:
  action: more-info
button_action:
  tap_action:
    action: more-info
entity: sensor.abfall_naechster
show_state: false
modules:
  - "!default"
grid_options:
  columns: 6
  rows: auto

[diablojeje91]

@TheSpirit

sensor.abfall_naechster_papier

I used your code, and it works fine for me.
It must be caused by a theme or a bug.