最近のデザインは動作が軽いアニメーションをいれているものが多いですよね。
やはり目を引くという事で、アニメーションは重要な要素の1つになってきているのかもしれません。
そこで本日はCSSとJSのコピペで簡単に導入出来る、動きが面白いかつ実用的なCSSアニメーションpart1をご紹介します。
part2はこちら↓
【UIデザイナー必見】動きが面白い！目を引くこと間違いなしのCSSアニメーション集part2
目次
- CSS loading animation
- Animated Shopping Cart Icons
- Hamburger Icon CSS3 ONLY Animation
- 404 Animated Character
- CSS Mars Landing
- CSS The Avengers
- Pure CSS Day/Night Toggle Swith
- Google Now 3rd Party Apps
- clo clo
- CSS preloader!
- Submit Button (GSAP edition)
- Elastic SVG Sidebar Material Design
- Particle button
- Gooey Menu
- Flipside
- The ultimate hamburger menu
CSS loading animation
Animated Shopping Cart Icons
Hamburger Icon CSS3 ONLY Animation
404 Animated Character
CSS Mars Landing
CSS The Avengers
Pure CSS Day/Night Toggle Swith
Google Now 3rd Party Apps
clo clo
CSS preloader!
Submit Button (GSAP edition)
See the Pen Submit Button (GSAP edition) by auginator (@auginator) on CodePen.
