How to make such canvas animation?

Question

Canvas

Hello everyone
Here on this site https://pepsico-lays-yellow-trend.snpdev.ru/
On the first screen, when you hover over the icons, animation is called.
Please tell me how it is implemented?

Answer 1

A bit of Chrome Dev Tools: And here is the library found: www.createjs.com/easeljs

Answer 2

But in general, this animation, as in the example, can be done on pure css, using animate on hover, animating only transform and opacity - in photo aparatik we animate opacity for the light bulb and flash (can be done using ::before and ::after) , in the gift box - transform (set transform-origin to the center of the bottom edge of the cupcake and flatten it vertically, slightly rotating around the vertical axis). Well, the heart is more complicated, but also quite simple - 2 half-dots rotate slightly in turn along the vertical axis and simultaneously with them (again, through pseudo-elements you can) rotate the semicircles that are perpendicular to the screen in the middle of the heart - this will create the effect of bending the border between the halves when pulsing