Removing shadow underneath app header?

Anyone know how to remove the app header shadow (or make it transparent)? I’ve seen a lot of advice for custom-cards but they seem to only apply to lovecard cards and not the app-header. I’ve managed to get it mostly transparent by using this in my theme file:

  app-header-background-color: "rgba(255, 255, 255, 0.2)"

And the header looks good when it’s right at the top but as soon as you scroll down, the shadow appears and looks like the screenshot. Help would be much appreciated. Thanks!

probably --app-header-border-bottom: none

FYI, you can inspect elements with F12 and chrome to see what they are

Great tip, so I had a look and it seems like box-shadow is the name of the element. I’ve tried all the below (one by one) below the app header background code and still no luck:

app-header-box-shadow: "rgba(255, 255, 255, 0.2)"
app-header-box-shadow: none
box-shadow: none
box-shadow: "rgba(0, 0, 0, 0)"

No luck so far unless I’m doing something wrong with the above code.

Sorry for reviving an old post, just figured out how with card_mod

card-mod-root-yaml: |
  app-header:
    .: |
      app-header::before {
        box-shadow: none;
      }
1 Like

Hi!! found it:
–mdc-top-app-bar-fixed-box-shadow: none