Vue3
@tsparticles/vue3
Official tsParticles Vue.js 3.x Component - Easily create highly customizable particle, confetti and fireworks animations and use them as animated backgrounds for your website. Ready to use components available also for Web Components, React, Vue.js 2.x,
Animation
front-end
frontend
tsparticles
particles.js
particlesjs
particles
particle
canvas
jsparticles
xparticles
Stars
9.0k
Weekly
7.3k
Open issues
23
Bundle
~60 kB
Installation
npm install @tsparticles/vue3Code example
import { motion } from "@tsparticles/vue3";
export function Example() {
return (
<motion.div
initial={{ opacity: 0, y: 12 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.35 }}
>
<h2>Animated with Vue3</h2>
</motion.div>
);
}Pros & cons
Pros
- Actively maintained by Matteo Bruni
- 7.3k weekly downloads. Battle tested
- First-class TypeScript definitions
- MIT licensed
Considerations
- Adds roughly ~60 kB to your bundle
- Needs client-only rendering in SSR frameworks
- Not supported in React Native
- 23 open issues on GitHub