change font in ionic input

Question

In an ionic app, I am trying to change the font family of input. in global.css i'm specifing the global font

* {
   font-family: 'FFMalmoom' !important; 
}

I want the ion-input text in specific page to take another family i tried:

ion-input {
    font-family: 'verdana' !important;
  }

ion-input {
    --ion-font-family: 'verdana' !important;
  }

with no success , It still takes 'FFMalmoom'.

Answer 1

Instead of specifying the global font in the global.scss move it to the :root selector in the variables.scss file with the --ion-font-family css variable

:root {
  --ion-font-family: 'FFMalmoom';
}

After that the font will still be applied globally as ionic uses this as the base font for the entire app. You can then set the ion-input font-family as you normally would with

ion-input{
  font-family: 'verdana';
}