防止两个叠加的HTML5 SVG颜色变暗

.svg1 {
  mix-blend-mode: lighten;
}

<svg>
  <defs>
    <filter id="brighten">
      <feColorMatrix type="matrix" values="1 0 0 0 0
                                            0 1 0 0 0
                                            0 0 1 0 0
                                            0 0 0 1 0" />
    </filter>
  </defs>
  <rect width="100" height="100" fill="red" filter="url(#brighten)" />
</svg>

function blendColors(color1, color2) {
  // 颜色计算逻辑
  return blendedColor;
}

var svgElement = document.getElementById('svg');
var color1 = getComputedStyle(svgElement).getPropertyValue('fill');
var color2 = 'blue';
var blendedColor = blendColors(color1, color2);
svgElement.style.fill = blendedColor;