Javascript Photoshop用于匹配图像颜色的算法

我问了一个问题，关于如何将一组任意图像的颜色规范化为一致的、类似instagram的过滤外观

我有一千张不同类型的图片，基本上就像你在维基百科上看到的一样。不过他们都是JPG。它们中的一些有着坚实的浅色或深色背景，上面有一个人物，比如黑色背景上的人，白色背景上的动物，或者绿色背景，等等。。有些像是花草树木的场景，色彩安排非常复杂，不是简单的纯色。他们中的一些人已经有了一个过滤器的提示，无论是复古的外观或凉爽的温度或温暖或高对比度HDR的外观

我想知道我的选择是什么，使图像网格的整体设计感觉完全融入网站周围的平面UI设计，因此图像可能有一种强调颜色或非强调颜色的暗示，所有的图像都有相同的整体温度/饱和度/对比度等。想知道是否有可能做到这一点

我想象着我会想出如何使用JavaScript中的颜色库来实现这一点，而不是手动浏览每个图像并调整滑块。如果可能的话，我希望它是自动的。也就是说，我以某种方式编写了一些代码，计算出图像的基线样式，然后将每个图像与该样式进行比较，并调整适当的数量以匹配。想知道a这是否可能，2如果这不是太多的问题，你是否可以告诉我如何开始正确的方向

最后，所有的图像都会有大致相同的调色板，相同的整体过滤效果外观

---

想知道photoshop是如何做到这一点的。如果不知道他们是如何做到的，他们不需要知道确切的算法，想知道什么是通用算法，可以在JavaScript中解决这个问题。我真的不知道从哪里开始。

使用CSS过滤器。为您的图像设置一个类，并按类选择它们

代码段：

.imgFilter{ -webkit过滤器：深褐色45%； 过滤器：海贼蓝45%； }

---

假设要规格化的图像是：，。在您的示例中，我没有看到如何将两个不同颜色的图像规格化为相同的输出。请参见：悬停时，您可以看到它们具有相同的颜色。

.blur {
  -webkit-filter: blur(4px);
  filter: blur(4px);
}

.brightness {
  -webkit-filter: brightness(0.30);
  filter: brightness(0.30);
}

.contrast {
  -webkit-filter: contrast(180%);
  filter: contrast(180%);
}

.grayscale {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

.huerotate {
  -webkit-filter: hue-rotate(180deg);
  filter: hue-rotate(180deg);
}

.invert {
  -webkit-filter: invert(100%);
  filter: invert(100%);
}

.opacity {
  -webkit-filter: opacity(50%);
  filter: opacity(50%);
}

.saturate {
  -webkit-filter: saturate(7);
  filter: saturate(7);
}

.sepia {
  -webkit-filter: sepia(100%);
  filter: sepia(100%);
}

.shadow {
  -webkit-filter: drop-shadow(8px 8px 10px green);
  filter: drop-shadow(8px 8px 10px green);
}
.inverted{
  -webkit-filter: invert(100%); /* Safari */
  filter: invert(100%);
}