The border-image-source property sets the image to draw as the border instead of the border-style. If none, or if the image fails to load, border-style is rendered normally..box {
border-image-source: url('frame.png');
}.box {
border-image-source: linear-gradient(45deg, magenta, cyan);
}noneNo border image — border-style is rendered normally (default).url()Image by URL.linear-gradient()Linear color gradient.radial-gradient()Radial color gradient.conic-gradient()Conic color gradient.repeating-linear-gradient()Repeating linear gradient.repeating-radial-gradient()Repeating radial gradient.repeating-conic-gradient()Repeating conic gradient.image-set()Selects an image by resolution/format.cross-fade()Cross-fades two images by a percentage.CSS Borders Module Level 4Working Draft<image>W3CMDNCSSShow all codeEdit CSS onlineThe plugin that remembers hundreds of CSS items for youEvery CSS property — in a live demonstrationThe bilingual CSS referencedefinitionexamplessyntaxmodulespecificationvalue typessourcesvisual demonstrationpreviousnext
