作者：IT程序狮
文章源自：http://www.jianshu.com/p/d3082080dbcf
作为前端开发者，相信大家对 CodePen 不是很陌生。它是一个非常了不起的网站，在上面大家不仅可以分享自己的 Web 作品，而且可以欣赏到世界各地的优秀开发者实现的各种酷炫效果。当然，你也可以从这里获取一些小灵感。
在本文中，小狮将与大家分享一些超炫的 CSS 动画效果。当然，除了欣赏外，有些Demo的作者也给出了具体实现的方法，值得我们去学习与借鉴。那么，一起来Enjoy吧！
-
纯CSS实现的爱心动画
--
no sprite, no JS heart animation BY：Ana Tudor
纯 CSS 实现 Twitter 上的爱心动画。原作者与大家分享了实现的整体过程，供大家学习与参考。
Smoothie Maker App in Pure CSS BY：Jamie Coulter
一个综合使用 CSS 各种属性实现的沙冰机 APP。大家可以去体验一下。
Login Form CSS only validation BY：James Nowland
用HTML+CSS实现的登录与验证界面。这样的用户体验是不是更加简单、直观呢。实现过程在这里。
Pokemon Go - ZingTouch x Anime.js BY：ZingChart
利用 Anime.js 实现的 Pokemon Go，是不是很酷呢？
CSS 3D Solar System BY：Julian Garnier
用HTML+CSS与少量JS代码完成的太阳系数据可视化动画。帅爆了，有木有！
-
纯CSS实现的人物动画
--
Character Animation in Pure CSS BY：Aakash Rodrigues
纯CSS实现的任务动画。作者没有使用JS、图片以及SVG，但整体效果还是不错滴。
Coffee Machine - SVG animation with CSS3 BY：Jonathan Silva
一个模仿dribbble上设计师Shir Gal的作品【咖啡机】，用CSS3+SVG重新实现的动画。是不是，一毛一样呢。
如果大家觉得还阔以，欢迎点赞、分享哦。另外，转载烦请注明出处，谢谢合作。
