CSS repeating-linear-gradient function
Gradients can form a pattern, and the repeating-linear-gradient
function can save you from the pain of writing the same thing over and over again. The syntax doesn't differ from the average linear-gradient
function and contains at least 2 color stops. To set a diagonal direction like in the example, you should specify the angle or direction.
The percentage values here define the color stops — the points where the line has a specific color. For example, the 0 point means the starting position for a purple line, and 10px refers to its ending point. The white line starts at 10px and ends at 20px — the function takes this rhythm to create a repeating gradient.