The mask-mode
CSS property sets whether the mask reference defined by mask-image
is treated as a luminance or alpha mask.
The mask-mode
CSS property sets whether the mask reference defined by mask-image
is treated as a luminance or alpha mask.
The mask-mode
property is specified as one or more of the keyword values listed below, separated by commas.
alpha
This keyword indicates that the transparency (alpha channel) values of the mask layer image should be used as the mask values.
luminance
This keyword indicates that the luminance values of the mask layer image should be used as the mask values.
match-source
If the mask-image
property is of type <mask-source>
, the luminance values of the mask layer image should be used as the mask values.
If it is of type <image>
, the alpha values of the mask layer image should be used as the mask values.
Initial value | match-source |
---|---|
Applies to | all elements; In SVG, it applies to container elements excluding the <defs> element and all graphics elements |
Inherited | no |
Computed value | as specified |
Animation type | discrete |
Specification |
---|
CSS Masking Module Level 1 # the-mask-mode |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
mask-mode |
No | No | 53 | No | No | 15.4 | No | No | 53 | No | 15.4 | No |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/mask-mode