In today’s quick tip I’m going to show you how to morph one SVG shape into another using a tool called Shape Shifter by Alex Lockwood.
Shape Shifter (amongst other things) takes imported SVGs and morphs them automatically into one another. As long as the two SVGs have the same number of path nodes the animation between the shapes will be perfectly smooth.
In this quick tip we’ll be taking a “hamburger menu” icon and morphing it into a “close” icon (a fairly classic use case).
Check out the video to see how it’s done!
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.Update me weekly
Envato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!Translate this post