Font-family placeholder ion-input Ionic5

Question

I am trying to change the font family of the placeholder of an <ion-input>.
In docs, there is no way to do it, since the only possible options for placeholders are --placeholder-color, --placeholder-font-style, --placeholder-font-weight and --placeholder-opacity.
This is the HTML:

<ion-input required 
           type="text" 
           maxlength="30"
           placeholder="Your username">
</ion-input>

What I already tried without success:

ion-input::placeholder {
  font-family: 'My-font', sans-serif;
  --ion-font-family: 'My-font', sans-serif;
}

and I tried to replace the ::placeholder with ::-webkit-input-placeholder, :-ms-input-placeholder, :-moz-placeholder.
What I'd like to achieve:

ion-input {
  --placeholder-font-family: 'My-font', sans-serif;
}

Answer 1

Placeholder font just inherits from the input font. If your input font and placeholder font can be the same, then just apply the css style to your input element.

ion-input {
  --ion-font-family: 'My-font', sans-serif;
}