tsParticles - Easily create highly customizable JavaScript particles effects, confetti explosions and fireworks animations and use them as animated backgrounds for your website. Ready to use components available for React.js, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Inferno, Solid, Riot and Web Components.
load methods to keep only a single one using a single object parametershape.image, shape.polygon, shape.stroke
particles section, not in the shape objectshape.options object@tsparticles/angular): https://github.com/tsparticles/angular
@tsparticles/astro): https://github.com/tsparticles/astro
@tsparticles/ember): https://github.com/tsparticles/ember
@tsparticles/inferno): https://github.com/tsparticles/inferno
@tsparticles/jquery): https://github.com/tsparticles/jquery
@tsparticles/lit): https://github.com/tsparticles/lit (WIP)
@tsparticles/preact): https://github.com/tsparticles/preact
@tsparticles/react): https://github.com/tsparticles/react
@tsparticles/riot): https://github.com/tsparticles/riot
@tsparticles/solid): https://github.com/tsparticles/solid
@tsparticles/svelte): https://github.com/tsparticles/
@tsparticles/vue2): https://github.com/tsparticles/vue2
@tsparticles/vue3): https://github.com/tsparticles/vue3
@tsparticles/webcomponents): https://github.com/tsparticles/webcomponents
@tsparticles/wordpress): https://github.com/tsparticles/wordpress
@tsparticles/preset-<name> #3977)@tsparticles/ organization in the package name, replacing tsparticles- prefix, except for tsparticles package which will remain the same.@tsparticles/slim bundle, only included in @tsparticles/all.@tsparticles/slim bundle, included in tsparticles.@tsparticles/slim bundle.reset method to updaters, this method will be called after a particle loses a life.fullScreen option is enabled (default behavior)aria-hidden="true" to canvas element, fixes #4785absorb.speed option to collisions sectionrgb(), hsl() and hsv() values in color option valuesinitAsync function from plugins, standard init is now async for all pluginstsparticles package, this is a breaking change only for those that are using it. Since it's a heavy plugin and not so much used, I have preferred removing it from the tsparticles package.bounds to particles.destroy options, if the particle is outside one of the bounds the particle will be destroyedsmooth to the options, it uses the fpsLimit field as a reference value trying to create a smoother animation on the provided fps value.canvasMask plugin, it uses a canvas, an image or a text for positioning particles in the canvas, closes #4492With the new smooth option enabled the animation will be affected by the fps on the user's PC, so be careful. Higher fps, higher speed, lower fps, lower speed ⚠️.
Some examples:
- with a fpsLimit of 60 the animation will be twice faster on 120 fps devices
- with a fpsLimit of 120 the animation will be twice slower on 60 fps devices
The animation will be always smooth, but the behavior could be affected by the user screen refresh rate.
It's recommended to keep this disabled, be careful enabling this.
getRandom and setRandom functions for customizing all the random behaviors, it's recommended to use the getRandom function instead of Math.random when writing plugins, so the randomness can be customized as expectedactive from slow interactivity mode object, it was obsolete, small breaking change but the engine will be a bit smaller