Ear Headphones/Website Animation Concept

Today, grids are almost the foundation of almost all web design. These invisible lines create a sense of rhythm and visual fluency in space, and they are the basis for making web pages more harmonious.

However, the purpose of the grid is to help you create a good design, and when you start to adapt to the existence of the grid, don't be tied to it. You don't have to be 100% constrained by the grid, and occasionally breaking the grid design may make your design more eye-catching. However, it is tricky to break the grid and keep the page coordinated.

It's also a good idea to get the elements out of the grid system with motion.

When a single element moves, the effect is very noticeable, and even the overall grid system is not so obvious.

Breaking the design of the grid is not easy to implement, because poor control often confuses the entire design. How to add whimsy without destroying the entire project? There is always nothing wrong with practicing more.
Inspiration for the work @Farzan Faruk