Color quantization using euclidean distance gives jumpy results

I'm working on an art project which converts pixels of live video feed into corporate logos based on the distance (in RGB) between the colors of the two. While this functions, it gives a jittery result. Seem like some points in the color space teeter in a sort of superposition between two "closest" points. I'm attempting a sort of naive clustering solution right now because I believe any proper one will be too slow for live video. I'm wondering if anyone has any good ideas to solve this problem? I'll include my code and an example of the result. Thank you!

(imgs array is the logos)

current result: https://gifyu.com/image/fk2y

function distance(r1, g1, b1, bright1, r2, g2, b2, bright2) {
  d =
    ((r2 - r1) * 0.3) ** 2 +
    ((g2 - g1) * 0.59) ** 2 +
    ((b2 - b1) * 0.11) ** 2 +
    ((bright2 - bright1) * 0.75) ** 2;
  return Math.round(d);
}

function draw() {

  if (x > 100 && z == true) {
    video.loadPixels();

    for (var y = 0; y < video.height; y++) {
      for (var x = 0; x < video.width; x++) {
        var index = (video.width - x - 1 + y * video.width) * 4;
        var r = video.pixels[index];
        var g = video.pixels[index + 1];
        var b = video.pixels[index + 2];
        var bright = (r + g + b) / 3;
        let least = 9999999;

        for (var i = 0; i < imgs.length; i++) {
          if (
            distance(
              imgs[i].r,
              imgs[i].g,
              imgs[i].b,
              imgs[i].bright,
              r,
              g,
              b,
              bright
            ) < least
          ) {
            least = distance(
              imgs[i].r,
              imgs[i].g,
              imgs[i].b,
              imgs[i].bright,
              r,
              g,
              b,
              bright
            );
            place = imgs[i].img;
          }
        }

        image(place, round(x * vScale), y * vScale, vScale, vScale);
      }
    }
  }
}