Custom border image template


Specify the location of the image to be used as the template for a custom border.

Property values

Despite its name, this property can be used to define a border image source from more than just image files.

<url> The URL of a bitmap image file
linear-gradient() Colors that gradually transition from top to bottom
radial-gradient() Colors that gradually transition from the center to the edges
conic-gradient() Colors that gradually transition around a point
repeating-linear-gradient() A pattern made up from linear gradients
repeating-radial-gradient() A pattern made up from radial gradients
repeating-conic-gradient() A pattern made up from conical gradients
none No image


/* a custom border from an image file gradient */            
border-image-source: url('');

/* a custom border from a linear gradient */
border-image-source: linear-gradient(green, violet);

style > framing > border-image-sourceCustom border image template