Compose mask-image declarations visually — fade edges, punch out shapes, build vignette gradients. Pick a preset, tune size/position/repeat, and copy production-ready CSS.
mask-image uses the alpha (or luminance) channel of an image to control where the element is opaque. Black/transparent regions in the mask hide pixels; white/opaque regions reveal them. Most modern browsers also support the un-prefixed properties — keeping -webkit- aliases is still wise for Safari and older WebViews. mask-mode: luminance treats brightness instead of alpha as the mask channel — useful for masks built from photos.