Я сделал сайт, который делает это colorglower.com Вы можете проверить его, чтобы увидеть демо.
Вот код JavaScript, который я использовал.
function lighten(color) {
// convert to decimal and change luminosity
var luminosity = 0.01
var computedColors = new Array();
var newColor = "#",
c, i, n, black = 0,
white = 255;
for (n = 0; n < 10; n++) {
for (i = 0; i < 3; i++) {
c = parseInt(color.substr(i * 2, 2), 16);
c = Math.round(Math.min(Math.max(black, c + (luminosity * white)), white)).toString(16);
newColor += ("00" + c).substr(c.length);
}
computedColors[n] = newColor;
var arrayUnique = checkIfArrayIsUnique(computedColors);
if (arrayUnique == false) {
computedColors.pop();
break;
}
computedColors[n] = newColor;
newColor = "#";
luminosity += calcPercentage();
}
return computedColors;
}
Что делает этот код, так это получает шестнадцатеричный цвет, а затем выводит 10 его самых легких цветовых версий и помещает их в массив. Вы можете изменить яркость на любую другую, чтобы настроить процент оттенка. Чтобы затемнить цвета, вам просто нужно изменить:
luminosity -= calcPercentage();