twolegs

Надо использовать значение userSpaceOnUse для gradientUnits.

<linearGradient gradientUnits="userSpaceOnUse" ...>

Когда вы пишите

<svg class="inline-svg-icon" fill="url(#red-blue)"><use...>

по сути каждый элемент просто наследует этот атрибут fill. И по умолчанию градиент рисуется в границах элемента. Если же указать userSpaceOnUse, то градиент будет рисоваться в пределах текущего viewport.

https://codepen.io/alexeyten/pen/rNLQKbm?editors=1000

Это конечно странное действие.

По вопросу, n++ возвращает предыдущее значение, т.е. у вас бесконечно вызывается iter(0). Замените iter(n++) на iter(n+1).