Наилучшим решением, когда требуется градиент между двумя цветами, является использование представления HSV (значение насыщенности оттенка).
Если у вас есть значения HSV для ваших двух цветов, вы просто делаете линейную интерполяцию для H, S и V, и у вас есть хорошие цвета (интерполяция в пространстве RGB всегда приводит к «плохим» результатам).
Вы также найдете здесь формулы для перехода от RGB к HSV и от HSV к RGB соответственно.
Теперь, для вашей проблемы с четырьмя углами, вы можете сделать линейную комбинацию четырех значений H / S / V, взвешенных по расстоянию от E до этих четырех точек A, B, C и D.
РЕДАКТИРОВАТЬ: тот же метод, что и tekBlues, но в пространстве HSV (его довольно просто проверить в RGB и в пространствах HSV. И вы увидите различия. В HSV вы просто поворачиваете хроматический цилиндр, почему это дает хороший результат)
EDIT2: если вы предпочитаете «скорость и простоту», вы можете использовать L1-норму вместо L2-нормы (евклидова норма)
Итак, если a - это размер вашего квадрата, а координаты ваших точек A (0, 0), B (0, a), C (a, 0), D (a, a), затем оттенок точки E (x, y) можно вычислить с помощью:
Hue(E) = ( Hue(B)*y/a + Hue(A)*(1-y/a) ) * (x/a) + ( Hue(D)*y/a + Hue(C)*(1-y/a) ) * (1-x/a)
, где Hue(A) - это оттенок точки A, Hue(B) - оттенок B и т. Д. *
Вы применяете те же формулы для насыщенности и значения.
Как только у вас есть оттенок / насыщенность / значение для вашей точки E, вы можете преобразовать ее в пространство RGB.