Ivan Bogachev

A lot of interesting infinite patterns in CSS animations can be obtained from the one idea. Today`s pen is an example of it. This animation consists of two steps with simple CSS transforms. There are no rare properties or magic behavior here.

The Pen by Ivan Bogachev (@sfi0zy).

The idea is very simple: take a number of small elements, put them into the one big element and rotate it. After that we can move the small elements in any direction and it will look like we have the infinite number of the elements. But it’s not the truth. The number of the elements is finite.