CSS色调旋转/饱和/亮度无法准确显示某些颜色

我正在使用Javascript将红色图标图像过滤/转换为RGB中指定的另一种颜色。更具体地说，我使用CSS过滤器色调旋转、亮度和饱和度将颜色从纯红色转换为目标颜色。我的结果适用于许多颜色，但有一些颜色不正确。有什么建议吗

您可以在我的代码中看到，我尝试了HSL和HSB计算，结果基本相同。当前代码使用HSB运行，我认为它更适合CSS过滤器属性

#myDIV2{
位置：绝对位置；
宽度：200px；
高度：200px；
}
函数rgbToHsl（r、g、b）{
r/=256，g/=255，b/=256；
var max=Math.max（r，g，b），min=Math.min（r，g，b）；
变量h，s，l=（最大+最小）/2；
如果（最大=最小）{
h=s=0；//消色差
}否则{
var d=最大-最小值；
s=d==0？0:d/（1-Math.abs（2*l-1））；
如果（d==0）{
h=0
}否则{
开关（最大值）{
案例r:h=（（g-b）/d）%6；断裂；
案例g:h=（b-r）/d+2；中断；
案例b:h=（r-g）/d+4；中断；
}
h/=6；
}
}
/*测试HSB而不是HSL=H是相同的*/
var br_hsb=最大值；
风险值s_hsb=（最大-最小）/br_hsb；
返回[h，s_hsb，br_hsb]；/[h，s，l]；
}
函数设置色调（r、g、b）{
hsl=rgbToHsl（r，g，b）；
h_str=Math.round（hsl[0]*360.toString（）；
s_str=（Math.round（hsl[1]*1000）/10.toString（）；
l_str=（Math.round（（hsl[2]+.5）*1000*1）/10.toString（）；/**2似乎更适合hsl*/
styleString=“色调旋转（“+h_str+”度）饱和（“+s_str+”%）亮度（“+l_str+”%）”）；
document.getElementById（“myDIV2”）.style.filter=styleString；
document.getElementById（'hue'）。value=h_str；
document.getElementById（'hsl_str'）。value=styleString；
}
设置图标的RGB：

R:
G:
B:
定色
色调：
HSL：

这是否回答了您的问题？这回答了你的问题吗？