mask-border
A shorthand property that lets you use an image as a 'border mask' for an element. This allows you to create decorative borders that are defined by an external image file.
It is documented as part of the CSS Masking specification.
Syntax
/* Usage Example */
.decorative-box {
mask-border: url(';border.png') 30 fill stretch;
/* applies a custom image-based border to the element */
}
/* Syntax */
mask-border: mask-border-mode;
/* Global values */
mask-border: inherit;
mask-border: initial;
mask-border: revert;
mask-border: revert-layer;
mask-border: unset;mask-border Browser support
Widely available
Since
2015 92% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
1+
17.2+
79+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more