mask-clip

Determines which area of the element (border, padding, or content box) the mask should actually apply to. It works similarly to 'background-clip'.

Quick example

.masked-element {
  /* Restricts the mask to the content area only */
  mask-clip: content-box;
}

Quick facts

Initial value
border-box
Inherited
No
Applies to
all elements and SVG container elements
Animation type
discrete

Values

no-clip

mask-clip Browser Support

Newly available Since 2023 88% global usage

Since 2023 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Works in all modern browsers. May need a fallback for older browsers.

120+
53+
15.4+
120+
ESC