How to resize ion-spinner

Question

I'm using ion-spinner in a ionic application. But im my case i want to change the size of the spinner. When i use custom css with default spinner Resizing works fine. But with Bubbles,Circles, Dots spinners, it doesn't work properly.
CSS

.spinner-large {
  width: 100px;
  height: 100px;
}

HTML

    <ion-spinner name="dots" class="spinner-large"></ion-spinner>

how can i fix this.

Stackblitz example

Answer 1

Try using

ion-spinner {
    transform: scale(3);
}

From ionic forum its mentioned that this will make you loose some resolution.

Answer 2

As Ionic 4, you can use width & height:

ion-spinner {
  width: 3em;
  height: 3em;
}

https://github.com/ionic-team/ionic-framework/issues/18115

Answer 3

I ran into a similar styling issue and to resolve it I needed to add position: absolute to css rules