What is the preferred way to create colors with JavaScript from RGB colors so that they can then be used to style elements as in the form of CSS colors like the following.

document.getElementById("some_id").style.color = "some_value"

Example below:

const colorsCbfRainbowRGB = {
  violet: [120,28,129],
  indigo: [64,67,153],
  blue: [72,139,194],
  green: [107,178,140],
  olive: [159,190,87],
  yellow: [210,179,63],
  orange: [231,126,49],
  red: [217,33,32]
}

What is the preferred way to create colors with JavaScript from RGB colors so that they can then be used to style elements as in the form of CSS colors like the following.

document.getElementById("some_id").style.color = "some_value"

Example below:

const colorsCbfRainbowRGB = {
  violet: [120,28,129],
  indigo: [64,67,153],
  blue: [72,139,194],
  green: [107,178,140],
  olive: [159,190,87],
  yellow: [210,179,63],
  orange: [231,126,49],
  red: [217,33,32]
}

• javascript
• css
• dom
• colors

4 Answers 4

You can convert to rgb(r, g, b) CSS colors very easily.

function rgb(values) {
    return 'rgb(' + values.join(', ') + ')';
}
console.log(rgb(colorsCbfRainbowRGB.violet));

This is supported by any browser worth mentioning, and simpiler than converting to hexadecimal.

You could use a string template with rgb() and RGB numbers.

function setColor(color) {
    const colorsCbfRainbowRGB = { violet: [120, 28, 129], indigo: [64, 67, 153], blue: [72, 139, 194], green: [107, 178, 140], olive: [159, 190, 87], yellow: [210, 179, 63], orange: [231, 126, 49], red: [217, 33, 32] };
    document.getElementById("out").style.color = `rgb(${colorsCbfRainbowRGB[color]})`;
}

setColor('orange');

<div id="out">foo bar baz</div>

Create random color(it's not only RGB colors)

function getRandomColor() {
    var letters = '0123456789ABCDEF';
    var color = '#';
      for (var i = 0; i < 6; i++ ) {
          color += letters[Math.floor(Math.random() * 16)];
      }
    return color;
}

Hope this Helps!!!

Use the hex rappresentation of a color: #rrggbb

Where rr is the amount of red from 00 to FF, gg the green and bb the blue.