Animation and transitions

12 entries

Vue's built-in <Transition> and <TransitionGroup> components already handle enter, leave and list-move animations with CSS classes or JavaScript hooks, so check them first. @formkit/auto-animate, the most-starred entry, adds animation to lists and layout changes with a single directive or composable. vue-animate ports Animate.css classes for use with the built-in transitions, and @morev/vue-transitions provides ready-made transitions for Vue 2 and 3 without writing CSS.

For Lottie files, @lottiefiles/dotlottie-vue is the official LottieFiles component and supports the compressed .lottie format, and vue3-lottie is a community alternative. ssgoi adds native-style page transitions with spring physics, and vue-kinesis builds interactive, pointer-driven effects. Whatever you use, respect the prefers-reduced-motion setting, and animate transform and opacity rather than layout properties to keep motion smooth.

On the bench stars against last commit

12 entries

@formkit/auto-animateformkit/auto-animate

Add motion to your apps with a single line of code

Vue 313.9kupdated 3mo ago

vue-kinesisvue-kinesis

A set of components to create interactive animations

Vue 2 only1.5kupdated 19d ago

vue-animate@asika32764/vue-animate

A Vue.js port of Animate.css. For use with Vue's built-in transitions.

Vue 2 + 31.4kupdated 1y ago

ssgoi@ssgoi/vue

Native app-like page transitions with spring physics, 60fps on mobile, SSR-ready, and all modern browser support

Vue 31kupdated 1d ago

@lottiefiles/dotlottie-vue@lottiefiles/dotlottie-vue

Official LottieFiles Vue component supporting the.lottie format (75% smaller files); convert and preview with IconKing

Vue 3926updated 3d ago

vue3-lottievue3-lottie

A component for importing and displaying Lottie animations in Vue 3

Vue 3427updated 1y ago

@morev/vue-transitions@morev/vue-transitions

Transitions library for Vue 2 and 3 with no CSS needed

Vue 2 + 3222updated 1d ago

vue-slide-up-downvue-slide-up-down

Like jQuery's slideUp / slideDown, but for Vue!

Vue 3202updated 1y ago

vue-countup-v3vue-countup-v3

A Vue 3 Component for animation counting.

Vue 3182updated 2y ago

v-odometerv-odometer

Smoothly transitions numbers with ease. Use this library to give your application a smooth animation, only applicable on numbers.

Vue 2 only101updated 2y ago

blottieblottie

Lottie component for Vue 3

Vue 314updated 2y ago

timered-countertimered-counter

A counter web component with smooth animations

Vue 37updated 1y ago
About this site
Esc

Type to search every entry. ↑↓ to move, Enter to open.