Vuejs Animation Resources

Shared Vue component across routes with animations Live Demo English | 简体中文 Why? It's quite common you might have a same component used in different r

vue-typed-js A Vue.js integration for Typed.js. Typed.js is a library that types. Enter in any string, and watch it type at the speed you've set, back

vue-countTo a vue component that will count to a target number at a specified duration

vue-kinesis Easy to use Vue.js components for creating interactive animations Demo Kinesis Demo Vue3 - Installation npm install --save [email protected]

Vue Konva Vue Konva is a JavaScript library for drawing complex canvas graphics using Vue. It provides declarative and reactive bindings to the Konva

Eagle.js - A slideshow framework for hackers Slideshow system built on top of the Vue.js Supports animations, themes, interactive widgets (for web dem

🤹 @vueuse/motion Vue Composables putting your components in motion 🏎 Smooth animations based on Popmotion 🎮 Declarative API 🚀 Plug & play with 10+

Tinymotion is a Vue.js animation library, that seamlessly works with Tailwind CSS.

The component to animate your text letter by letter. You can bind different classes to each letter using css selectors.

vue-typed-js A Vue.js integration for Typed.js. Typed.js is a library that types. Enter in any string, and watch it type at the speed you've set, back

Lottie Animation View for Vue (React, Angular) Generated by create-vue-component Wapper of bodymovin.js bodymovin is Adobe After Effects plugin for ex

Vue 3 Lottie vue3-lottie was created to help developers add Lottie animations to their Vue 3 applications. In my search for a simple way to add Lottie

A collection on gsap, animejs and other animation library implemented in vue 3

一个小巧玲珑的 vue 组件切换动画库, 支持 20 几种动画切换方式

flipbook-vue flipbook-vue is a Vue component that displays images in 3D page flip effect. Demo page is here. Installation Install as a module: npm i -

Deprecation notice Due to an unfortunate naming decision, this package has moved to vue-smooth-reflow. vue-smooth-reflow has more features, better han

vue-flat-surface-shader A Vue component for flat surface shader DEMO: Github Pages How to use npm install --save vue-flat-surface-shader Main.js impor

🤹 Vue Composables putting your components in motion

Vue Animate CSS v-animate-css The easiest to implement Vue directive for Animate.css If you like this project, please give it a star, and consider fol

Vue Stripe Menu Creating a navigation menu with animations like on Stripe Only for Vue 3 (changelog) Demo Website Vue 2 - Branch How to install Instal

animated-number-vue A simple vue animated number for Vue2, using anime. Live demo here Usage $ npm install animated-number-vue # OR $ yarn add animate

animated-number-vue A simple vue animated number for Vue2, using anime. Live demo here Usage $ npm install animated-number-vue # OR $ yarn add animate

lottie-vuejs lottie-vuejs is currently in development! Use in production environment at your own risk lottie-vuejs is a simple VueJS wrapper for lotti

A like button with delightful star animation powered by Vue.js

Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API.

English | 简体中文 Vue Typical Vue Animated typing in ~400 bytes 🐡 of JavaScript. Preview → Live Demo ✨ https://vue-typical.vercel.app 📦 Installation In

在使用vue3中,用于页面展示的缩放操作 vue3-sketch-ruler 简体中文 | English 💪 Vue 3 Composition API 🔥 Written in TypeScript Vue 3 + Vite + ts 打包sketchRuler 由于项目升级成vite， 发

vue2-transitions Demo Codesandbox ✨ Reusable component transitions Why ❓ Brings only the code that you need. Many alternative solutions import the who

vue2-transitions Demo Codesandbox ✨ Reusable component transitions Why ❓ Brings only the code that you need. Many alternative solutions import the who

Vue Wavify A single Vue component to create and adjust an animated wave using svg & javascript. Installation Yarn yarn add vue-wavify npm npm install

Vue Animate CSS v-animate-css The easiest to implement Vue directive for Animate.css If you like this project, please give it a star, and consider fol

vue-roller Fluid and smooth rolling animation for Vue.js Demo Try out here with your own text! Getting Started npm npm i vue-roller Vue import Roller

vue-flipper A component to flip elements with a nice transition. ⚡ It is really small, JavaScript + CSS (min + gzip) is smaller than 1KB 🎨 CSS uses S

v-shared-element Declarative shared-element transitions between pages for Vue.js. Uses illusory under the hood. v3.1.0 released! Vue 3 is now supporte

vue-marquee-text-component [CSS GPU Animation] Marquee Text for vuejs Demo Demo here Install Vue 3 (master) | Vue 2 (v1) npm install vue-marquee-text-

Odometer About Vue-Odometer Smoothly transitions numbers with ease. Use this library to give you application a smooth animation, only applicable on nu

Odometer About Vue-Odometer Smoothly transitions numbers with ease. Use this library to give you application a smooth animation, only applicable on nu

Odometer About Vue-Odometer Smoothly transitions numbers with ease. Use this library to give you application a smooth animation, only applicable on nu

vue-flip-toolkit A Vue.js port of the wonderful react-flip-toolkit, developed by @aholachek (to whom all credit is due here) Quick Start yarn add vue-

Vue-Anime Simple Vue bindings for Anime.js Install $ npm install --save vue-animejs import VueAnime from 'vue-animejs'; Vue.use(VueAnime) Usage Adds

Page level transition plugin for vue-router

Example： 使用方法 安装插件 npm i vueg --save 引入插件 import vueg from 'vueg' Vue.use(vueg, new Router(), Options) // 传入实例化后的router, Options为可选的插件配置 插件指令 插件注册了名为

Heads up! The fate of this repo is uncertain. I recommend using my new library, vue-flip-toolkit for all of your magic-move transition needs. vue-over

Heads up! The fate of this repo is uncertain. I recommend using my new library, vue-flip-toolkit for all of your magic-move transition needs. vue-over

Vue Smooth Reflow (VSR) A Vue mixin that transitions reflow. When the component's data is changed, any CSS properties that you register will transitio

vue-sticker Vue component, that helps to make sticky effects Installation # install component npm install --save-dev vue-sticker using like local comp

This library is collection of Vue single-file components to render animated buttons.

The tool makes it easy to create animated GIFs of Slack custom emoji.

vue-anime Vue animation with timeline and grouping support using http://animejs.com/ Usage npm install vue-anime In vue file, first import import {Vue

vue2-animate for Vue.js 2 and 3 Cross-browser CSS3 animation library A Vue.js port of Animate.css. For use with Vue's built-in transitions. | DEMO Cre

This is a lightweight Vue 3 component made with TypeScript to quickly create an animation that shows an automatic count of any quantity in any duration, counting up or down.

femtoTween femtoTween's goal is to provide just enough tweening functionality to cover basic use cases. Through this primary goal, it should also be o

femtoTween femtoTween's goal is to provide just enough tweening functionality to cover basic use cases. Through this primary goal, it should also be o

Super simple Vue preloader component Just check src/components/Preloader.vue. Si