Angular Material mat-spinner custom color

Does anyone know how can I change mat-spinner color in Angular Material? Overriding css doesn't work. I tried changing color in material files but they can only be imported, I can't change anything there. I want it to be my custom color, not color from prebiult-themes.

Use this code for ** < mat-spinner >** add this code in your .css file

.mat-progress-spinner circle, .mat-spinner circle {
stroke: #3fb53f;
}

This answer will work for those who're looking for a flexible solution in Angular 4 / 6 / 7. If you wan't to change the color of a mat-spinner at a component level, you'll need to use the ::ng-deep selector. Knowing this, the solution is quite easy.

• In your html file:

    <div class="uploader-status">
        <mat-spinner></mat-spinner>
    </div>

• In your css / scss file:

    .uploader-status ::ng-deep .mat-progress-spinner circle, .mat-spinner circle {
        stroke: #000000;
    }

Easy Fix!

Add custom css rules inside styles.css instead of component.css file

.mat-progress-spinner circle, .mat-spinner circle {
    stroke: #2A79FF!important;
}