CSS properties: mask-mode and mask-type

[estelle]

part of openwebdocs/project#224 and #39151

[github-actions]

Preview URLs

• /en-US/docs/Web/CSS/mask-mode
• /en-US/docs/Web/CSS/mask-type

Flaws (4)

URL: /en-US/docs/Web/CSS/mask-mode
Title: mask-mode
Flaw count: 2

• macros:
  • Macro produces link /en-US/docs/Web/CSS/CSS_cascade/initial_value which is a redirect
  • Macro produces link /en-US/docs/Web/CSS/CSS_cascade/computed_value which is a redirect

---

URL: /en-US/docs/Web/CSS/mask-type
Title: mask-type
Flaw count: 2

• macros:
  • Macro produces link /en-US/docs/Web/CSS/CSS_cascade/initial_value which is a redirect
  • Macro produces link /en-US/docs/Web/CSS/CSS_cascade/computed_value which is a redirect

(comment last updated: 2025-05-06 16:56:57)

[dipikabh]

Review for the mask-type page

[dipikabh]

Could we add examples here to better convey which values in the mask are used for alpha and luminance masking? For example, if fill="rgb(0 0 0 / 0.5)", it means 50% transparent. So the corresponding shape on the masked element will display at 50% opacity when using alpha as the value.
And a similar example for luminance will be helpful.
Quick examples here will be helpful along with the detailed explanations covered in "Description".

[dipikabh]

How about also demo'ing the effect of different mask-mode values, especially the effect of the non-default value. (similar to what's in the spec)

[dipikabh]

Review for mask-mode

[estelle]

{{svgattr("mask-type")}} will be supported once very shortly (when #39318 goes live)

[estelle]

Thanks @dipikabh. I think i caught everything and SVG mask-type attribute page is now live, so red should be gone.

[dipikabh]

Thanks a lot for all the updates, @estelle!
I've suggested a few more improvements. But leaving a +1.