tsParticles - v4.0.0-beta.12
    Preparing search index...

    Particles Size

    Controls the visual size of particles, including animated grow/shrink effects.

    Key Type Example Notes
    value number / range 4 / { min: 1, max: 8 } Base radius in pixels
    animation.enable boolean true / false Animates size over time
    animation.speed number 3 Rate of change as a function of other size values
    animation.startValue string min / max / random Starting point of the animation
    animation.sync boolean true / false When true, all particles resize in sync
    animation.destroy string min / max / none Destroys the particle when size reaches the chosen bound
    {
    "size": {
    "value": 4
    }
    }
    {
    "size": {
    "value": { "min": 1, "max": 6 }
    }
    }
    {
    "size": {
    "value": { "min": 2, "max": 8 },
    "animation": {
    "enable": true,
    "speed": 2,
    "startValue": "random",
    "sync": false
    }
    }
    }
    {
    "size": {
    "value": 6,
    "animation": {
    "enable": true,
    "speed": 1,
    "startValue": "max",
    "destroy": "min"
    }
    }
    }
    • Using destroy: "min" without an emitter to replenish particles will result in an empty canvas
    • animation.sync: true is ignored when startValue is random
    • Retina devices multiply value by devicePixelRatio; combine with detectRetina: true for consistent results