Folding cover animation in CSS


I was highly inspired by @Daryl Ginn from his Flipper shot so I decided to learn some new stuff. This is the result of my learning process on CSS perspective, transform and transition. It is a bit tough to get the transition right especially with the angle and gradient and shit. After more than 5 revisions, this is the probably the best one I can achieve, for now. Let me know what you think!

See it in action

Note: Work best in latest FF and Chrome. Safari's transition is not that smooth for me here.


keyboard shortcuts: L or F like