CSS: Repeating Linear Gradient

What is repeating-linear-gradient

repeating-linear-gradient() function creates repeating stripes of color patterns.

Syntax

the syntax is the same as Linear Gradient, but the last color stop at the end should be less than 100%, else there is no room repeat.

Basic example

.basic-mwZ3y {
 background-image: repeating-linear-gradient(90deg, red 0%, white 20%);
 width: 100px;
 height: 100px;
}

Example. Zebra strips

.xzebra-srQFz {
 background-image: repeating-linear-gradient(45deg, black 0, black 15px, white 15px, white 30px);
 height: 50px;
 border: solid 1px grey;
}