bug(mat-dialog): default Dialog backdrop color is hardcoded black 32% instead of using mat-sys-scrim

[kainiedziela]

Description

Not sure if this is a bug or intentional, please advise

The default Angular Material behavior when opening a Dialog is to add a 32% opacity black scrim for the overlay. This is not in any way customizable and instead is hardcoded in the Angular CDK overlay implementation:

components/src/cdk/overlay/_index.scss

Line 9 in 501d674

$overlay-backdrop-color: rgba(0, 0, 0, 0.32) !default;

Since there is an existing mat-sys-scrim token for this exact purpose I recommend it be used for customization purposes and for the ability to account for light and dark themes.

Reproduction

https://material.angular.dev/components/dialog/overview

Expected Behavior

mat-sys-scrim token is used for scrims

Actual Behavior

Hardcoded 32% opacity black value is used for the scrim

Environment

• Angular: v22
• CDK/Material: v22
• Browser(s): any
• Operating System (e.g. Windows, macOS, Ubuntu): any

[crisbeto]

I think the reason we didn't do it was because the backdrop comes from the CDK and the tokens are Material-specific. It would be an easy fix with the backdropClass option, but I suspect we'll need to update a bunch of screenshot tests internally.