From 745177c5e611d7f87bb889379aadfaf05d0a9c42 Mon Sep 17 00:00:00 2001 From: yogeshwaran-c Date: Tue, 24 Feb 2026 01:53:30 +0530 Subject: [PATCH] docs(theming): mention mat.theme mixin in M2 to M3 migration section --- guides/material-2.md | 21 ++++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/guides/material-2.md b/guides/material-2.md index 20eda3f8f900..14ed66610b06 100644 --- a/guides/material-2.md +++ b/guides/material-2.md @@ -1090,9 +1090,24 @@ for how to read values from an M3 theme). ### Pass a new M3 theme in your global theme styles -Create a new M3 theme object using `define-theme` and pass it everywhere you were previously passing -your M2 theme. All Angular Material mixins that take an M2 theme are compatible with M3 themes as -well. +Replace your M2 theme with an M3 theme. For v19 and later, use the `mat.theme` +mixin as described in the [theming guide][theming]: + +```scss +@use '@angular/material' as mat; + +html { + @include mat.theme(( + color: mat.$violet-palette, + typography: Roboto, + density: 0, + )); +} +``` + +Alternatively, you can create a theme object with `mat.define-theme` and pass it +to individual component theme mixins. This approach is needed for backwards +compatibility helpers such as `color-variants-backwards-compatibility`. ### Update usages of APIs that are not supported for Material 3 themes