How to Get Hex Color Value Rather Than Rgb Value

How to get hex color value rather than RGB value?

var hexDigits = new Array
        ("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"); 

//Function to convert rgb color to hex format
function rgb2hex(rgb) {
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}

function hex(x) {
  return isNaN(x) ? "00" : hexDigits[(x - x % 16) / 16] + hexDigits[x % 16];
 }

(Source)

RGB to hex and hex to RGB

Note: both versions of rgbToHex expect integer values for r, g and b, so you'll need to do your own rounding if you have non-integer values.

The following will do to the RGB to hex conversion and add any required zero padding:

function componentToHex(c) {
  var hex = c.toString(16);
  return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
  return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

alert(rgbToHex(0, 51, 255)); // #0033ff

How can i easily convert a rgb color value into a hex color value?

Use printf or sprintf with %x format,

my ($r,$g,$b) = (12,102,250);
printf("#%02x%02x%02x",$r,$g,$b);

output:

#0c66fa

Convert hex color to RGB values in PHP

Check out PHP's hexdec() and dechex() functions:
http://php.net/manual/en/function.hexdec.php

Example:

$value = hexdec('ff'); // $value = 255

hex colors not are not working correctly in javascript

HTMLElement.style.backgroundColor returns a rgb color value. You have to convert it before looking for its' index. Here is a solution.

var arr = ['#FF6633', '#FFB399', '#FF33FF', '#FFFF99', '#00B3E6',
    '#E6B333', '#3366E6', '#999966', '#99FF99', '#B34D4D',
    '#80B300', '#809900', '#E6B3B3', '#6680B3', '#66991A',
    '#FF99E6', '#CCFF1A', '#FF1A66', '#E6331A', '#33FFCC',
    '#66994D', '#B366CC', '#4D8000', '#B33300', '#CC80CC',
    '#66664D', '#991AFF', '#E666FF', '#4DB3FF', '#1AB399',
    '#E666B3', '#33991A', '#CC9999', '#B3B31A', '#00E680',
    '#4D8066', '#809980', '#E6FF80', '#1AFF33', '#999933',
    '#FF3380', '#CCCC00', '#66E64D', '#4D80CC', '#9900B3',
    '#E64D66', '#4DB380', '#FF4D4D', '#99E6E6', '#6666FF'];

let colorName = document.getElementById("demo");
let btn = document.getElementById("btn");
btn.addEventListener("click", () => {
    changeColorName();
    changeBackGroundColor();
});
colorName.innerText = arr[0]

 function changeColorName(){
    let change = colorName.innerHTML;
     let index = arr.indexOf(change) +1;
     if(index == arr.length){
         index = 0
     }
      
     var result = arr[index];
     colorName.innerHTML = result;
     
 }

let changeBgColor = document.getElementById("body");
changeBgColor.style.backgroundColor = arr[0]

function changeBackGroundColor() {
    let change = changeBgColor.style.backgroundColor;
    change = rgb2hex(change).toUpperCase();
    let index = arr.indexOf(change) + 1;
    if (index == arr.length) {
        index = 0
    }

    var result = arr[index];
    console.log(result);
    changeBgColor.style.backgroundColor = result;

}
const hexDigits = new Array
       ("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");
function rgb2hex(rgb) {
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}

function hex(x) {
  return isNaN(x) ? "00" : hexDigits[(x - x % 16) / 16] + hexDigits[x % 16];
 }

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="index.css">
</head>
<body id="body">
    <p id="demo"></p>
    <button id="btn">Click Me</button>
    <script src="index.js"></script>
</body>
</html>

How to Get Hex Color Value Rather Than Rgb Value