сборка массива цветов и их оттенков!!!
 

Коллеги, доброго времени суток, суть такая, для проекта нужно собрать массив цветов.

Например, берем цвет зеленый, и нужно получить какое-то кол-во его оттенков. на выходе должно быть так:

let colors = {
        green: [
            // и тут то самое кол-во его оттенков.
        ]
}

Как собрать массив я в курсе!!! Вопрос именно как получить оттенки? Под оттенками я полагаю изменение черного, типа светлее темнее.

Входящий цвет в любом формате hex / rgb. выходной цвет также. Переводить цвета, можно так:

hexToRGB(hex) {

		let c;

		if (/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) {
			
			c = hex.substring(1).split('');
			
			if(c.length == 3){
				
				c = [c[0], c[0], c[1], c[1], c[2], c[2]];

			}

			c = `0x` + c.join('');

			return [(c>>16)&255, (c>>8)&255, c&255];
		}

		return [];

	}

Откопал в сети.

Подскажите кто в курсе, или куда смотреть по крайней мере.
Заранее благодарю.

Так?

var colors=[[255,0,0],[0,255,0]],
	shades=[];

colors.forEach(function(color,index){
	shades[index]=[];
	let counter=255;
	while(counter){
		shades[index][counter--]=color.map(function(val){
			return !val?val:val-counter;
		});
	};
});

console.log(shades);

Nexus, минутку!!!

Nexus, если поставить например 228,60,30 то дальше будут отрицательные значения

Роман Андреевич, скрипт перед вами, поправьте.

Nexus, да я просто поделился. Спасибо

Nexus, тут еще вопрос в том, я пытаюсь понять как вообще оттенки изменяются??? Темнее, потом еще темнее и так далее.

Как сам процесс происходит

проще всего получить цвет в формате HSL (есть библиотеки готовые), в котором уже менять L

потом либо конвертить обратно в rgb (если это надо), либо использовать напрямую - background-color: hsl(60,100%,25%);

https://webref.ru/css/value/color

Alexandroppolus, большое спасибо, разобрался!!!

Решила воздержаться от создания новой темы, вопрос собсна о том как правильно перевести цвет из rgb в hsl и обратно, например есть зелёный (hex #008000, rgb 0,128,0 hsl 120,0,50) или темно-синий (hex #000080 rgb 0,0,128 hsl 240,0,50) вопрос собсна почему когда на странице прописываешь цвет в rgb, он получается одного оттенка, а когда прописываешь в hsl тот же самый цвет он получается совсем другого оттенка?