Accessing current color of tsParticles particles

I want to read out the current color of my tsParticles upon a button press and process it further. With particlesJS I was able to achiev this and I wanted to switch to tsParticles. Sadly now I only get an error message stating "Uncaught TypeError: Cannot read properties of undefined (reading 'particles')". The (simplified) code I'm using is:

tsParticles.load("tsparticles", {
  particles: {
    color: {
      value: "#ff0000",
      animation: {
        enable: false,
        speed: 20,
        sync: true
      }
    }}})

thirdButton.addEventListener( "click", function() {
  console.log("Button clicked");
let currentColor= tsParticles.options.particles.color.value;
console.log(currentColor);
particle_colorchange(currentColor)

});

Both are initialized and load correctly and work. The error comes from "tsParticles.options.particles.color.value;"

I was expecting the color (hex value) to be displayed / further processed. I tried various ways to access the color. ALso I tried to narrow down where exactly the error occurs by using

  if (typeof tsparticles !== 'undefined') {
    let currentColor = tsparticles.options.particles.color.value;
    console.log(currentColor);
    particle_colorchange(currentColor)
  } else {
    console.error("tsparticles object is not defined");
  }

and going step by step for the typeof (menaing next is: typeof tsparticles.options. Sadly I could find an answer with that.

Any help is much appreciated.

You can read out the current color with for example a button press like this. Inside the button eventlistener function you add

let currentColor= tsParticles.domItem(0).particles.container.options.particles.color.value ;

to read out the particle color and:

let currentColor= tsParticles.domItem(0).particles.container.options.particles.links.color.value ;

to read out the link color.

and assign a new color like this:

tsParticles.domItem(0).particles.container.options.particles.color.value = new_color; tsParticles.domItem(0).particles.container.options.particles.links.color.value=new_color; tsParticles.domItem(0).refresh();

I have not figured out how to update the assignment for onhover links & particles but there should be a way.