CSS Repeating GradientsWhat is a Repeating Gradient?
The repeating-linear-gradient() and the repeating-radial-gradient() create gradients consisting of repeating linear or radial gradients.
They are similar to the linear-gradient() and radial-gradient() and they take the same arguments, but instead of producing only a single gradient, they repeat the color stops in all directions so as to cover the entire container to which they are applied.
background: repeating-linear-gradient(direction, color-stop1, color-stop2, ...);
background: repeating-linear-gradient(#7A7FBA, #11C37C 25%);
background: repeating-radial-gradient(shape-position, start-color, ..., end-color);
background: repeating-linear-gradient(#7A7FBA, #11C37C 50%);
You can read more information about browser compatibility here. For maximum cross-browser compatibility and coverage, it's important that you use CSS prefixes. You can use this tool to append CSS prefixes to your CSS code.
CSS Gradients Generator
You can easily generate your own gradients with the online css gradient generator.