change font size of ion-label in a single page - Ionic

Issue

I want to change the font size of a ion-label in the home page of a ionic app. I have read that I can change the font size variables in the __variables.scss file, which could affect the ion-label. I think I could do that. But I find it strange that it doesn't work to style the ion-label in the scss file associated with the page. I have searched online but I couldn't find anything about it, other than that my approach should work.

This is my scss:

$primary-color: #cf810c;
$bg-color: #CCFFFF;

page-home {
    .masters{
        background-color:$bg-color;
    }
    ion-label{
        color: $primary-color;
        font-size: 4em;
   }
}

And this is the content in my html file:

<ion-content padding class="masters">
  <ion-label stacked>Tap and press the buttons to win!</ion-label>
</ion-content>

My page looks as follows:

Solution

You just need to do like this:

This is working stackblitz

my-page.html

  <ion-label stacked class="my-label">Tap and press the buttons to win!</ion-label>

my-page.scss

.my-label {
  font-size: 4em;
}

Answered By - Sampath