How icon morphingactually works

A hamburger becoming a cross looks like one of the simplest animations on the web. It is not. Something has to decide which line becomes which line, and every approach to that question leads somewhere different.

Ten parts, front to back, ending with enough to go and build it yourself. Every number on this site came out of the compiler that renders it, rather than out of a paragraph.

Drag it. There is a real shape at every point in the middle, and that is what the manual is about.

Start at Part 0 See all ten parts

Written by Sanyam.