C'est ce qu'on appelle l' interpolation des couleurs . C'est ce que font les dégradés sous le capot. Vous pouvez le faire en utilisant une variété de moyens et de méthodes, et la façon exacte dont les résultats sont interpolés dépend de la méthode.
Je le fais couramment pour les projets Web utilisant JavaScript afin de pouvoir changer les couleurs dynamiquement, comme dans ce visualiseur de musique . Une implémentation JavaScript qui a une méthode d'interpolation linéaire très simple utilisant RVB, tirée de l'exemple ci-dessus, est la suivante:
// Returns a single rgb color interpolation between given rgb color
// based on the factor given; via https://codepen.io/njmcode/pen/axoyD?editors=0010
function interpolateColor(color1, color2, factor) {
if (arguments.length < 3) {
factor = 0.5;
}
var result = color1.slice();
for (var i = 0; i < 3; i++) {
result[i] = Math.round(result[i] + factor * (color2[i] - color1[i]));
}
return result;
};
// My function to interpolate between two colors completely, returning an array
function interpolateColors(color1, color2, steps) {
var stepFactor = 1 / (steps - 1),
interpolatedColorArray = [];
color1 = color1.match(/\d+/g).map(Number);
color2 = color2.match(/\d+/g).map(Number);
for(var i = 0; i < steps; i++) {
interpolatedColorArray.push(interpolateColor(color1, color2, stepFactor * i));
}
return interpolatedColorArray;
}
Qui est utilisé comme tel et retourne un tableau des couleurs interpolées:
var colorArray = interpolateColors("rgb(94, 79, 162)", "rgb(247, 148, 89)", 5);
Vous pouvez également trouver des extensions PhotoShop (et probablement d'autres programmes) pour effectuer l'interpolation des couleurs. Cependant, vous voudrez peut-être vérifier que la méthode d'interpolation est la même que celle que vous souhaitez, car vous pouvez utiliser n'importe quelle fonction pour interpoler en fonction.