Angular Material And Changing Fonts
Answer : You can use the CSS universal selector ( * ) in your CSS or SCSS : * { font-family: Raleway /* Replace with your custom font */, sans-serif !important; /* Add !important to overwrite all elements */ } Starting from Angular Material v2.0.0-beta.7 , you can customise the typography by creating a typography configuration with the mat-typography-config function and including this config in the angular-material-typography mixin: @import '~@angular/material/theming'; $custom-typography: mat-typography-config( $font-family: 'Raleway' ); @include angular-material-typography($custom-typography); Alternatively ( v2.0.0-beta.10 and up): // NOTE: From `2.0.0-beta.10`, you can now pass the typography via the mat-core() mixin: @import '~@angular/material/theming'; $custom-typography: mat-typography-config( $font-family: 'Raleway' ); @include mat-core($custom-typography); Refer to Angular Material's typography documentation for more ...