Here is a possible implementation of a basic particle collision algorithm in Javascript using the HTML Canvas:
```js
// Create a canvas element and get its context
var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");

// Set the canvas size and append it to the document body
canvas.width = 800;
canvas.height = 600;
document.body.appendChild(canvas);

// Define a particle class with properties and methods
class Particle {
  constructor(x, y, r, vx, vy, color) {
    this.x = x; // x position
    this.y = y; // y position
    this.r = r; // radius
    this.vx = vx; // x velocity
    this.vy = vy; // y velocity
    this.color = color; // color
  }

  // Draw the particle on the canvas
  draw() {
    ctx.beginPath();
    ctx.arc(this.x, this.y, this.r, 0, Math.PI * 2); // draw a circle
    ctx.fillStyle = this.color; // fill with color
    ctx.fill();
    ctx.closePath();
  }

  // Update the particle position and velocity
  update() {
    // Check for wall collisions and bounce back
    if (this.x + this.r > canvas.width || this.x - this.r < 0) {
      this.vx *= -1; // reverse x velocity
    }
    if (this.y + this.r > canvas.height || this.y - this.r < 0) {
      this.vy *= -1; // reverse y velocity
    }

    // Move the particle by adding the velocity to the position
    this.x += this.vx;
    this.y += this.vy;
  }
}

// Define a function to check for particle collisions and resolve them
function checkCollisions(particles) {
  // Loop through all pairs of particles
  for (var i = 0; i < particles.length - 1; i++) {
    for (var j = i + 1; j < particles.length; j++) {
      var p1 = particles[i]; // first particle
      var p2 = particles[j]; // second particle

      // Calculate the distance and angle between them
      var dx = p2.x - p1.x;
      var dy = p2.y - p1.y;
      var d = Math.sqrt(dx * dx + dy * dy);
      var angle = Math.atan2(dy, dx);

      // Check if they are overlapping
      if (d < p1.r + p2.r) {
        // Calculate the new velocities after collision using the conservation of momentum and kinetic energy formulas
        var m1 = p1.r * p1.r; // mass of first particle proportional to area
        var m2 = p2.r * p2.r; // mass of second particle proportional to area
        var v1 = Math.sqrt(p1.vx * p1.vx + p1.vy * p1.vy); // speed of first particle
        var v2 = Math.sqrt(p2.vx * p2.vx + p2.vy * p2.vy); // speed of second particle
        var a1 = Math.atan2(p1.vy, p1.vx); // direction of first particle
        var a2 = Math.atan2(p2.vy, p2.vx); // direction of second particle

        var u1x =
          (v1 * Math.cos(a1 - angle) * (m1 - m2) +
            2 * m2 * v2 * Math.cos(a2 - angle)) /
          (m1 + m2); // x component of new velocity of first particle
        var u1y = v1 * Math.sin(a1 - angle); // y component of new velocity of first particle

        var u2x =
          (v2 * Math.cos(a2 - angle) * (m2 - m1) +
            2 * m1 * v1 * Math.cos(a1 - angle)) /
          (m1 + m2); // x component of new velocity of second particle
        var u2y = v2 * Math.sin(a2 - angle); // y component of new velocity of second particle

        var v1x = u1x * Math.cos(angle) - u1y * Math.sin(angle); // final x velocity of first particle
        var v1y = u1x * Math.sin(angle) + u1y * Math.cos(angle); // final y velocity of first particle

        var v2y = u2x * Math.sin(angle) + u2y * Math.cos(angle); // final y velocity of second particle

        // Assign the new velocities to the particles
        p1.vx = v1x;
        p1.vy = v1y;
        p2.vx = v2x;
        p2.vy = v2y;

        // Move the particles apart to avoid overlapping
        var overlap = 0.5 * (p1.r + p2.r - d + 1);
        p1.x -= overlap * Math.cos(angle);
        p1.y -= overlap * Math.sin(angle);
        p2.x += overlap * Math.cos(angle);
        p2.y += overlap * Math.sin(angle);
      }
    }
  }
}

// Create an array of particles with random positions, sizes, velocities and colors
var particles = [];
var colors = ["red", "green", "blue", "yellow", "pink", "purple", "orange"];
for (var i = 0; i < 10; i++) {
  var x = Math.random() * canvas.width; // random x position
  var y = Math.random() * canvas.height; // random y position
  var r = Math.random() * 20 + 10; // random radius between 10 and 30
  var vx = Math.random() * 10 - 5; // random x velocity between -5 and 5
  var vy = Math.random() * 10 - 5; // random y velocity between -5 and 5
  var color = colors[Math.floor(Math.random() * colors.length)]; // random color from the array
  var particle = new Particle(x, y, r, vx, vy, color); // create a new particle
  particles.push(particle); // add it to the array
}

// Define a function to animate the canvas
function animate() {
  // Clear the canvas
  ctx.clearRect(0, 0, canvas.width, canvas.height);

  // Loop through all the particles and update their positions and draw them
  for (var i = 0; i < particles.length; i++) {
    var particle = particles[i];
    particle.update();
    particle.draw();
  }

  // Check for collisions and resolve them
  checkCollisions(particles);

  // Request the next animation frame
  requestAnimationFrame(animate);
}

// Start the animation
animate();
```
spam fails_task lang_mismatch pii not_appropriate hate_speech sexual_content quality toxicity humor helpfulness creativity violence