tsParticles 1.17.0
Release Notes
tsparticles
- Added
path
property toparticles.rotate
options to rotate the particle following its path, defaults to false - Added
trail
mode for mouse interactivity (click and hover) to create a particle trail while moving or dragging the mouse - Added
attract
click/hover mode to attract particles to mouse position - Added
draggable
option to absorbers to make them draggable, defaults to false - Fixed color un-sync animation start value
- Stroke color can now be animated like the (fill) color
-
setOnClickHandler
function has an additional parameter containing clicked particles
react-tsparticles
- Added two
create-react-app
templates:cra-template-particles
andcra-template-particles-typescript
- Renamed
params
tooptions
, the old property is still supported
preact-particles
- Renamed
params
tooptions
, the old property is still supported
particles.vue
- Changed version to 2.0.0 for breaking changes
- The component uses a single
options
attribute containing the particles config, like in all the other components - The component now is initialised with
Vue.use
because it has a plugin now
ng-particles
- Changed version to 2.0.0 for breaking changes
- The component now uses
<Particles />
tag instead of<ng-particles />
svelte-particles
- Created
Svelte
component
Some Pens of the new features
Black hole with orbiting particles
Particles direction-aware - Planes sample
Mouse moving Particles trail
Related projects
jQuery
If you want to use tsParticles with jQuery checkout this repository
VueJS
If you want to use tsParticles with VueJS checkout this repository
ReactJS
If you want to use tsParticles with ReactJS checkout this repository
3rd Party
A 3rd-party component is available too, read more here
Preact
If you want to use tsParticles with Preact checkout this repository
Angular CLI
If you want to use tsParticles with Angular CLI (actually v9) checkout this repository
Useful links
Checkout the demos here: https://particles.matteobruni.it
Do you want to replace the old, outdated and abandoned particles.js
?
You're in the right place!
GitHub repo
https://github.com/matteobruni/tsparticles
npm
https://www.npmjs.com/package/tsparticles
yarn
https://yarnpkg.com/package/tsparticles
jsDelivr
https://www.jsdelivr.com/package/npm/tsparticles
CDNJS
https://cdnjs.com/libraries/tsparticles
Feel free to contribute to the project!
Demos
Here are some demos!
Custom Presets
watch the code for creating custom presets
Custom Shapes
watch the code for creating custom shapes
Characters as particles
FontAwesome characters as particles:
Mouse hover connections
Polygon mask
Background Mask particles
Polygon Mask with multiple paths
This polygon has 4 paths
Emitters
This login background is made with particles emitters, cool isn't it?
Absorbers
Have you ever wanted a black hole? Here's yours!
Collisions
The collisions in the previous releases, and in Particles.js too, were horrible. Now they're fixed and they look good. Finally!
Twinkle effect
Particles twinkling
Noise trails
Infection
Growing particles
Simplified addParticle
method
Links with triangles filled
Color animations
Warp out mode
Click play/pause mode
Euro flags with Divs interaction
External Noise Generator
External Noise Generator with noise field drawn
COVID-19 SARS-CoV-2 particles
Don't click! DON'T CLICK! OH NO IT'S SPREADING!!!!
COVID-19 is not funny. It's a serious world problem and we should prevent its spreading. If you are in a risky area please STAY AT HOME
Top comments (0)