CSS propriedade mask-mode

Definição e uso

mask-mode A propriedade especifica se a imagem de máscara deve ser vista como máscara de brilho ou alpha.

Faça a imagem de máscara ser vista como máscara de brilho:

.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	Descrição
match-source	Se a propriedade mask-image for uma imagem (URL de imagem ou gradiente), defina mask-mode como alpha. Se a propriedade mask-image for SVG <mask>, use a propriedade mask-type do elemento <mask>. Este é o valor padrão.
luminance	Use o valor de brilho da imagem de máscara como valor de máscara.
alpha	Use o valor alpha da imagem de máscara como valor de máscara.
initial	Defina essa propriedade como seu valor padrão. Veja initial.
inherit	Herda essa propriedade do elemento pai. Veja inherit.

Valor padrão:	match-source
Herança:	Não
Produção de animação:	Não suportado. Veja:Propriedades relacionadas a animação.
Versão:	Módulo de Mascaramento CSS Nível 1
Sintaxe do JavaScript:	object.style.maskMode="alpha"