mask-mode

Summary

This property indicates whether the <mask-reference> is treated as a luminescence mask or as an alpha mask.

Overview table

Initial value: auto
Applies to: All elements. In SVG, it applies to container elements without the <defs> element and all graphics elements.
Inherited: No
Media: visual
Computed value: As specified.
Animatable: No

CSS Object Model Property
:

Percentages: N/A

Syntax

mask-mode: alpha
mask-mode: auto
mask-mode: luminance

Values

auto: Implicitly sets alpha or luminance, depending on the <mask-reference> value of the mask-image property. If it is of type <mask-source>, the luminance values of the mask image should be used as the mask values; if it is of type <image>, the alpha values of the mask image should be used as the mask values.
alpha: Indicates that the alpha values of the mask image should be used as the mask values.
luminance: Indicates that the luminance values of the mask image should be used as the mask values.

Examples

/* auto */
#img1 {
    mask-source-type: auto;
  }

/* alpha */
#img2 {
    mask-source-type: alpha;
  }

/* luminance */
#img3 {
    mask-source-type: luminance;
  }

Related specifications

CSS Masking Level 1: W3C Editor’s Draft