Get to know MDN better
Esta página ha sido traducida del inglés por la comunidad. Aprende más y únete a la comunidad de MDN Web Docs.
No estándar: Esta función no está estandarizada. No recomendamos usar funciones no estándar en producción, ya que tienen un soporte limitado en los navegadores y pueden cambiar o eliminarse. Sin embargo, pueden ser una alternativa adecuada en casos específicos donde no exista una opción estándar.
La propiedad -webkit-mask-composite especifica la forma en la que múltiples imágenes de máscara son compuestas para ser aplicadas al mismo elemento. Son compuestas en el orden en el que son declaradas en la propiedad -webkit-mask-image.
Donde:
<composite-style>clear | copy | source-over | source-in | source-out | source-atop | destination-over | destination-in | destination-out | destination-atop | xor
Los píxeles coincidentes en la imagen origen y destino son borrados.
copyLa imagen de máscara origen reemplaza la imagen de máscara destino.
source-overLa imagen de máscara origen se dibuja sobre la imagen de máscara destino.
source-inLos píxeles coincidentes en las imágenes de máscara origen y destino son reemplazados por los píxeles de la imagen origen; los demás son borrados.
source-outLos píxeles coincidentes en las imágenes de máscara origen y destino son borrados; todos los demás píxeles de la imagen de máscara origen son dibujados.
source-atopSe dibujan los píxeles de la imagen de máscara destino. Los de la imagen de máscara destino sólo son dibujados si están sobre una parte no transparente de la imagen de máscara destino. Esto provoca que la imagen de máscara origen no tengo efecto alguno.
destination-overSe dibuja la imagen de máscara destino sobre la de origen.
destination-inLos píxeles coincidentes en las imágenes de máscara origen y destino permanecen; los demás son borrados.
destination-outLos píxeles coincidentes en las imágenes de máscara origen y destino se borran; se dibuja todos los demás píxeles de la imagen de máscara origen.
destination-atopSe dibujan Los píxeles de la imagen de máscara origen. Los de la imagen de máscara destino sólo se dibujaran si coinciden con una parte no transparente de la imagen de máscara destino. Esto provoca que la imagen de máscara destino no tenga efecto.
xorLos píxeles coincidentes en las imágenes de máscara origen y destino se convierten en totalmente transparentes y ambos con totalmente opacos.
No forma parte de ningún estándar. Esta propiedad se especifica como mask-composite utilizando diferentes valores.
Enable JavaScript to view this browser compatibility table.
-webkit-mask, -webkit-mask-clip, -webkit-mask-origin, -webkit-mask-box-image, -webkit-mask-attachment,-webkit-mask-image
This page was last modified on 31 mar 2026 by MDN contributors.
Your blueprint for a better internet.
Portions of this content are ©1998–2026 by individual mozilla.org contributors. Content available under a Creative Commons license.