A repeating SVG gradient is defined using the spreadMethod attribute. A value of repeat causes the color stops to repeat in the same order, from beginning to end:

A repeating linear gradient The gradient starts dark, slowly shifting to light, then quickly dark again. This pattern repeats four times left to right, each time brightening across a large region and then getting dark within a short space.

In contrast, a value of reflect causes the order and spacing of colors to alternate in each repeat:

A reflecting linear gradient The gradient again starts dark, slowly shifting to light, then quickly dark again. However, the next repeat shifts quickly to the light, then slowly back dark. The original pattern is then repeated, followed by the reflected version again.

Both of these gradients repeat the sequence of color stops four times, from left to right.