平均定义线性渐变的两种颜色的最佳方法是什么？

Question

如果我的RGB值定义了两种颜色，我可以对红色，绿色和蓝色值进行平均，然后组合以定义看起来像两者的视觉平均值的第三种颜色吗？

即NewColor =（R1 + R2）/ 2，（G1 + G2）/ 2，（B1 + B2）/ 2

EDIT1：感谢所有回复。对于我目前的需求，我只处理颜色相同的颜色对，所以我认为平均它们会起作用。但是，我将尝试转换为Lab Space以确保该假设是正确的，并且该技术将来会有用。

EDIT2：这是我的结果FWIW。 Color1和Color2是我的两种颜色，两个中间列是L a b空间中的平均值和平均RGB的结果。在这种情况下，两种颜色之间没有太大差异，因此平均技术的输出差异很小。

Answer 1

有几个答案建议转换为Lab色彩空间 - 这可能是更复杂的色彩处理的好方法。

但是如果您只需要快速获取两种颜色的平均值，则可以在RGB空间中完成。您只需要注意一个警告：您必须在对它们求平均值之前对RGB值求平方，然后取结果的根。 （如果你只是取平均值，结果将会太暗。）

像这样：

NewColor = sqrt((R1^2+R2^2)/2),sqrt((G1^2+G2^2)/2),sqrt((B1^2+B2^2)/2)

这是一个很好的视频，它解释了为什么这种方法有效：https://www.youtube.com/watch?v=LKnqECcg6Gw

Answer 2

查看this question的答案。

基本上，您希望将颜色转换为名为Lab space的颜色，并在该空间中找到它们的平均值。

实验室空间是一种表示颜色的方式，其中彼此接近的点是那些看起来与人类相似的点。

Answer 3

我不知道从感知的角度来看，对组件的简单平均值是否是“最佳”（这听起来像心理学家的问题），但这里有一些使用简单组件平均的例子。

红芥末绿色很丑，但插值似乎足够合理。

Answer 4

HSL color space中的平均值可能会产生更好的结果。

Answer 5

是。你可以像这样平均两种颜色。这是OpenGL用于将颜色混合在一起的方法（例如，在创建用于渲染远处对象的mip贴图或渲染50％透明纹理时）。对于许多情况，它快速，简单，“足够好”。然而，这并不完全现实，可能不会用于照片质量的图像。

Answer 6

这很难。首先，一组RGB值不定义颜色。它们需要根据它们所指的颜色原色（颜色空间）进行解释，例如sRGB，Rec.709，Rec.2020，Adobe RGB（1998）等。

此外，我们通常遇到的RGB值与线性光不成比例：它们使用非线性函数（gamma）“编码”。有时（在大多数视频应用中）“黑色”的值不为零，而是从零偏移，对于8位值通常为16。而“白色”不是255而是235. sRGB和Rec.709共享RGB原色，但它们的伽玛函数不同。

色彩空间转换从删除任何黑色偏移开始，使黑色为零。如果gamma函数中有断点（如sRGB和Rec.709那样），则需要仔细缩放RGB值，使“white”为1.0。

然后，通过执行原始伽马函数的逆来“解码”伽玛。 （一个答案建议对值进行平方，这是伽玛解码的近似值。）现在，您在某些颜色空间中具有线性光RGB值。此时，您可以从该颜色空间转换为Lab空间。从RGB到Lab的大多数转换都经过一个名为XYZ的中间色彩空间。

作为嵌套函数调用的步骤：

Lab = XYZ2Lab（RGB2XYZ（gamma_decode（offset_and_scale（RGB）， gammaFunction ）， RGB色彩空间））

（实验室空间是在1976年开发的，旨在创建标准CIE XYZ空间的感知均匀翘曲。（Luv是另一种尝试。）这个想法是两种颜色之间的欧几里德（直线）距离对于任何两种颜色，明显不同的（1“JND”）将是相同的距离。实验室中两种颜色之间的距离称为“delta-E”。简单的delta欧几里德距离公式现在称为dE76。 https://en.wikipedia.org/wiki/Color_difference）

在您的情况下，您可以平均两种Lab颜色以获得新的Lab颜色，然后反转所有转换以在您选择的颜色空间中返回RGB。

这会让你接近，但不能保证，只是因为“颜色”是人类的感知，而不是物理量，并且众所周知难以可靠地表征。实验室在感知统一方面实际上并没有那么好。因此，他们提出了一个新的，更复杂的delta-E函数，而不是修复Lab，它内置了另一个warp：DE94。这更好，但并不完美，所以2000年出现了另一个提议：DE2000。也更好但不完美。有关详细信息，请参阅上面的Wiki页面。

如果DE2000不够好（或太复杂！），你可能会看一下名为ICtCp的Lab的替代品，据称它比实验室在感知上更加统一。

Answer 7

我认为，arntjw的答案是朝着正确的方向前进，并且识别出对数底层，如Dan W.所提到的。但是，正确的几何平均值不是sqrt（（C1 ^ 2 + C2 ^ 2）/ 2） ，但是sqrt（C1 * C2）。所以平均颜色是：

<form class="form23" action="insert-paciente.php" method="post"> <!-- formulario dentro de las pestañas  -->
<input id="text2" type="text" placeholder="C.I" name="ci_p"  pattern="[0-9]{7,8}" title="Introduzca una cedula valida" required/> <br>
<input id="text2" type="text" placeholder="Primer nombre"  name="primer_nombre" pattern="[A-Za-z]" title="Ingrese solo caracteres alfabeticos" required/><br>
<input id="text2" type="text" placeholder="Segundo nombre" name="segundo_nombre" pattern="[A-Za-z]" title="Ingrese solo caracteres alfabeticos"/><br>
<input id="text2" type="text" placeholder="Primer Apellido"  name="primer_apellido" pattern="[A-Za-z]" title="Ingrese solo caracteres alfabeticos" required/><br>
<input id="text2" type="text" placeholder="Segundo Apellido"  name="segundo_apellido" pattern="[A-Za-z]" title="Ingrese solo caracteres alfabeticos"/><br>
<select id="select1" name="sexo" required>
<option value="">Sexo</option>
<option value="M">M</option>
<option value="F">F</option>
</select><br>
<select id="select1" name="tipo_p" required>
<option value="">Tipo de paciente</option>
<option value="Personal">Personal</option>
<option value="Estudiante">Estudiante</option>
<option value="Atencion a la comunidad">Comunidad</option>
</select><br>
<select id="select1" name="tipo_personal" >
<option value="">Tipo de Personal</option>
<option value="Administrativo">Personal</option>
<option value="Docente">Estudiante</option>
<option value="Obrero">Comunidad</option>
</select><br>
<select id="select1" name="especialidad" >
<option value="">Especialidad</option>
<option value="Administracion">Administracion</option>
<option value="Agroalientacion">Agroalientacion</option>
<option value="Contaduria publica">Contaduria publica</option>
<option value="Electricidad">Electricidad</option>
<option value="Informatica">Informatica</option>
<option value="Mantenimiento">Mantenimiento</option>
<option value="Mecanica">Mecanica</option>
<option value="Procesos quimicos">Procesos quimicos</option>
<option value="Quimica">Quimica</option><option value="Procesos quimicos">Comunidad</option>
<option value="Seguridad alimentaria">Seguridad alimentaria</option>
</select><br>
<input id="text2" type="text" placeholder="Alergias"  name="alergias" pattern="[A-Za-z]" title="Ingrese solo caracteres alfabeticos" required /><br>
<label id="lb2" for="text2">Fecha de nacimiento</label> <br>
<input id="text2" type="date"  name="fecha" required /> <br>
	<input id="text2" type="submit" value="Registrar"/>
</form>

产生的颜色更接近我们的预期。您可以使用更高阶的根来推广更多颜色，并通过向其组件添加指数来对每种颜色进行加权。

Answer 8

实际上有一种更简单的方法。

• 将图像缩小到1px，1px。

  1px的颜色是您缩放的平均颜色