mask-mode
Specifies whether the mask should be treated as an alpha mask (using transparency) or a luminance mask (using brightness).
Quick example
.luminance-mask {
/* Uses the brightness of the image to determine visibility */
mask-mode: luminance;
} Quick facts
Initial value
match-sourceInherited
No
Applies to
all elements and SVG container elements
Animation type
discrete
mask-mode Browser Support
Newly available Since 2023 88% global usage
Since 2023 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
Works in all modern browsers. May need a fallback for older browsers.
120+
53+
15.4+
120+