Options

This page is the main map for root options.

Use it to choose where to start, then jump to the detailed guides for each option group. For full type details, use the API reference too:

• https://particles.js.org/docs/interfaces/tsParticles_Engine.Options_Interfaces_IOptions.IOptions.html

Choose your configuration path

• I want full manual control: define particles, interactivity, and background yourself
• I want a quick object to inspect and edit: start from @tsparticles/configs
• I want a ready effect first: use a preset and then override only the fields you care about
• I need responsive behavior: add responsive rules after your base config is stable

Minimal complete example

{
  "background": {
    "color": "#0f172a"
  },
  "fpsLimit": 60,
  "detectRetina": true,
  "interactivity": {
    "events": {
      "onHover": {
        "enable": true,
        "mode": "repulse"
      }
    }
  },
  "particles": {
    "links": {
      "enable": true
    },
    "move": {
      "enable": true
    },
    "number": {
      "value": 80
    }
  }
}
Copy

Most-used root options

Property	Type	Example	Notes
autoPlay	boolean	true / false	Starts animation automatically
background	object	{ color: "#111" }	See IBackground
backgroundMask	object		See IBackgroundMask
detectRetina	boolean	true / false	Replaces retina_detect
duration	number / range	60 / { min: 30, max: 90 }	Effect duration in seconds
fpsLimit	number	60	Default: 60; replaces fps_limit
fullScreen	object / boolean	true / false	See IFullScreen
interactivity	object		See IInteractivity
manualParticles	array		See IManualParticle
motion	object		See IMotion
particles	object		See IParticlesOptions
pauseOnBlur	boolean	true / false	Pauses when the tab loses focus
pauseOnOutsideViewport	boolean	true / false	Pauses when canvas is outside viewport
preset	string / array	"links" / ["links", "confetti"]	Loads official or custom presets
responsive	array		See IResponsive
themes	array		See ITheme

Plugin options (not included in slim)

Property	Type	Example	Notes
absorbers	object / array		See IAbsorber
emitters	object / array		See IEmitter
polygonMask	object		See IPolygonMask

Deep links for option groups

• Background: Options/Background
• Background Mask: Options/BackgroundMask
• Full Screen: Options/FullScreen
• Interactivity: Options/Interactivity
• Motion: Options/Motion
• Particles: Options/Particles
• Themes: Options/Themes

Detailed guides for the most updated sections

Interactivity

• Click
• Hover
• Div

Particle visuals and behavior

• Color
• Bounce
• Collisions
• Destroy
• Group
• Life
• Orbit
• Palette
• Repulse
• Roll
• Rotate
• Shadow
• Stroke
• Tilt
• Twinkle
• Wobble
• ZIndex

Plugin-powered options

• Absorbers
• Emitters
• Infection
• Polygon Mask

Recommended starting sources

• Config objects: https://github.com/tsparticles/tsparticles/blob/main/utils/configs/README.md
• Official presets: https://github.com/tsparticles/presets
• Official palettes: https://github.com/tsparticles/palettes
• Main getting-started guide: Pages/index

Common pitfalls

• Enabling plugin options (emitters, absorbers, polygonMask) without loading their packages
• Setting very high particle counts before validating performance
• Mutating runtime options without a container refresh
• Migrating old configs without converting snake_case keys

Next steps

• Color values and formats: Color
• Runtime container management: Container
• Official presets: https://github.com/tsparticles/presets
• Config package: https://github.com/tsparticles/tsparticles/blob/main/utils/configs/README.md