mask-repeat

Controls whether the mask image is tiled (repeated) across the element, and how it is tiled. It works exactly like 'background-repeat'.

Quick example

.single-mask {
  /* Ensures the mask image only appears once and is not repeated */
  mask-repeat: no-repeat;
}

Quick facts

Initial value
repeat
Inherited
No
Applies to
all elements and SVG container elements
Animation type
discrete

mask-repeat 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