Atributo mask-mode de CSS

Definición y uso

mask-mode El atributo especifica si la imagen de la máscara debe considerarse como máscara de brillo o alpha.

Haga que la imagen de la máscara sea considerada como máscara de brillo:

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 70%;
  mask-repeat: no-repeat;
  mask-mode: luminance;
}

mask-mode: match-source|luminance|alpha|initial|inherit;

Valor	Descripción
match-source	Si la propiedad mask-image es una imagen (URL de imagen o degradado), configure mask-mode como alpha. Si la propiedad mask-image es SVG <mask>, utilice la propiedad mask-type del elemento <mask>. Este es el valor predeterminado.
luminance	Use el valor de brillo del ícono de máscara como valor de máscara.
alpha	Use el valor alpha del ícono de máscara como valor de máscara.
initial	Establezca este atributo en su valor predeterminado. Vea initial.
inherit	Hereda este atributo de su elemento padre. Vea inherit.

Valor predeterminado:	match-source
Herencia:	No
Producción de animación:	No se admite. Consulte:Atributos relacionados con la animación.
Versión:	Módulo de Máscara CSS Nivel 1
Sintaxis de JavaScript:	object.style.maskMode="alpha"