[UI designer must see] movement is interestingCSS animation collection part1 without a doubt to catch the eye

In recent years, many of the designs have light animations, aren't they?
Animation may be one of the most important factors because it's still eye-catching.

So today, I'm going to introduce a css animation part1 that is interesting and practical, which can be easily introduced with CSS and JS coppe.

Part2 is here ↓

6/27/2018【UIデザイナー必見】動きが面白い！目を引くこと間違いなしのCSSアニメーション集part2

CSS loading animation

See the Pen CSS loading animation by Patrik Hjelm (@patrikhjelm) on CodePen.

Animated Shopping Cart Icons

See the Pen Animated Shopping Cart Icons by Joni Trythall (@jonitrythall) on CodePen.

Hamburger Icon CSS3 ONLY Animation

See the Pen Hamburger Icon CSS3 ONLY Animation by Dawid Krajewski (@DawidKrajewski) on CodePen.

404 Animated Character

See the Pen 404 Animated Character by Mark Thomes (@WithAnEs) on CodePen.

CSS Mars Landing

See the Pen CSS Mars Landing by Mathew Gitchell (@mgitch) on CodePen.

CSS The Avengers

See the Pen CSS The Avengers by mario s maselli (@mariosmaselli) on CodePen.

Pure CSS Day/Night Toggle Swith

See the Pen Pure CSS Day/Night Toggle Swith by Jason Dicks (@jsndks) on CodePen.

Google Now 3rd Party Apps

See the Pen Google Now 3rd Party Apps by Paweł Kuna (@codecalm) on CodePen.

clo clo clo

See the Pen clo clo by Judith Neumann (@judag) on CodePen.

CSS preloader!

See the Pen CSS preloader! by Paul (@Maseone) on CodePen.

Submit Button (GSAP edition)

See the Pen Submit Button (GSAP edition) by auginator (@auginator) on CodePen.

Elastic SVG Sidebar Material Design

See the Pen Elastic SVG Sidebar Material Design by Nikolay Talanov (@suez) on CodePen.

Particle button

See the Pen Particle Button made with Canvas and HTML5 #html5 #button #particle #css #button @codepen @codepen @igcorreia Check this by Ign acio Correia (@igcorreia) on CodePen.