Under typical conditions, the toast is visually separated from the underlying page by a change in background color and a drop shadow.
When Windows High Contrast Mode (WinHCM) is enabled (aka forced-colors mode), custom background colors are replaced by the user's chosen color palette and drop shadows are removed. This means that the toast isn't clearly visually separated from the background.
(WinHCM users can fully customize colors, but in general, themes use either a dark or light background color.)
This can be fixed by adding a transparent border to the toast. Under typical conditions it will look the same as before, but when WinHCM is active the border will be detected and colored automatically. This provides visual separation that was lost when the other visual changes were removed.
Note: WinHCM is built into Windows. It can be emulated on macOS in Chromium-based browsers via Developer Tools > Rendering > Emulate CSS media feature forced-colors. To emulate light and dark themes in Chromium-based browsers, Developer Tools > Rendering > Emulate CSS media feature prefers-color-scheme while forced-colors mode is enabled.
Under typical conditions, the toast is visually separated from the underlying page by a change in background color and a drop shadow.
When Windows High Contrast Mode (WinHCM) is enabled (aka
forced-colorsmode), custom background colors are replaced by the user's chosen color palette and drop shadows are removed. This means that the toast isn't clearly visually separated from the background.(WinHCM users can fully customize colors, but in general, themes use either a dark or light background color.)
This can be fixed by adding a transparent border to the toast. Under typical conditions it will look the same as before, but when WinHCM is active the border will be detected and colored automatically. This provides visual separation that was lost when the other visual changes were removed.
Note: WinHCM is built into Windows. It can be emulated on macOS in Chromium-based browsers via Developer Tools > Rendering > Emulate CSS media feature forced-colors. To emulate light and dark themes in Chromium-based browsers, Developer Tools > Rendering > Emulate CSS media feature prefers-color-scheme while forced-colors mode is enabled.