Ionic 4 transparent transparent header

If you want translucent header in ionic 4 you need to add the "translucent" property to the header tag, not the toolbar tag.

<ion-header translucent="true">
  <ion-toolbar>
    <ion-title>Toolbar Title</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content fullscreen="true">
    <!-- content here -->
</ion-content>

From the ionic doc... Translucent

Attribute: translucent Type: boolean If true, the header will be translucent. Note: In order to scroll content behind the header, the fullscreen attribute needs to be set on the content. Defaults to false.


...    
<ion-toolbar color="translucent"> 
...

and if you want to get rid of the box shadow of your header you can do it in your css like:

.header::after {
  background-image: none;
}

Did you try this ?

ion-toolbar {
   --background-color: transparent;
   --ion-color-base: transparent !important;
 }