As front-end developer engineers, we often need to make cool animation effects. You know, that’s very interesting.
In this article, I want to share with you 10 animation libraries that can greatly improve our work efficiency and through which we can create amazing animation effects.
1. Animate.css
Animate.css provides many animations and we can use it easily. It is one of my favorite css animation libraries.
2. Velocity.js
from velocity Velocity is an animation engine with a similar API to jQuery’s $.animate(). It has no dependencies, but will happily extend jQuery, Zepto, and even the native DOM. It’s incredibly fast, and it features color animation, transforms, loops, easings, SVG support, and scrolling.
3. Hover.css
from Hover.css A collection of CSS3 powered hover effects to be applied to links, buttons, logos, SVG, featured images and so on. Easily apply to your own elements, modify or just use for inspiration. Available in CSS, Sass, and LESS.
4. React Spring
from React Springreact-spring is a cross-platform spring-physics first animation library.
It’s as simple as:
const styles = useSpring({
from: {
opacity: 0
},
to: {
opacity: 1
}
})
<animated.div style={styles} />