mask-type property CSS Reference

---

Definition and Usage

The CSS mask-type properties defines if a SVG <mask> element is a luminance or an alpha mask.

• Initial luminance
• Applies to <mask>
• Inherited no
• Media visual
• Computed value the unique non-ambiguous order defined by the formal grammar
• Animatable no

---

Syntax

mask-type: luminance | alpha

---

Values

luminance

Is a keyword indicating that the associated <mask> is a luminance mask, that is that its relative luminance values must be used when applying it.

alpha

Is a keyword indicating that the associated <mask> is an alpha mask, that is that its alpha channel values must be used when applying it.

---

Examples

Let's apply the following rectangle as a mask:

<rect x="10" y="10" width="80" height="80" fill="red" fill-opacity="0.7" />

mask

<svg>
<rect x="10" y="10" width="80" height="80" fill="red" fill-opacity="0.7"/>
</svg>