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
Widely availableSince 202388% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2023.
Safe to use without fallbacks.
120+
53+
15.4+
120+