Question

How to generate a random color in HEX format with JavaScript

Answer 1

function getRandomHexColor() {
  return ("#" + Math.random().toString(16).slice(2, 8));
}
 
console.log(getRandomHexColor());
 
   
     
     
/*
run:
     
#a7971c
     
*/

 

70+ SQL courses for beginners and professionals

Answer 2

function getRandomHexColor() {
  return ("#" + Math.random().toString(16).slice(2, 8));
}


document.body.style.background = getRandomHexColor();

  
  
    
    
/*
run:
    

    
*/

 

70+ SQL courses for beginners and professionals

Answer 3

function random_color() {
        return  '#' + Math.floor(Math.random()*16777215).toString(16);
}
 
const color = random_color();
  
console.log(color);
      
      
/*
run:
      
#b5ac85
 
      
*/
 

 

70+ SQL courses for beginners and professionals

Answer 4

function generateRandomHexColor() {
  const hexChars = "0123456789ABCDEF";
  let hex = "";
   
  for (let i = 0; i < 6; i++) {
    hex += hexChars[Math.floor(Math.random() * 16)];
  }
   
  return hex;
}
 
console.log(`Random HEX Color: #${generateRandomHexColor()}`); 
 
 
/*
run:
 
Random HEX Color: #8D279F
 
*/

 

70+ SQL courses for beginners and professionals

Answer 5

/**
 * Generate a random color in hex format (#RRGGBB).
 * This program demonstrates how numbers and bits are used
 * to produce a valid 24‑bit color value.
 */

/**
 * Create a 24‑bit random integer (0x000000–0xFFFFFF).
 * Math.random() gives a floating‑point number in [0, 1),
 * so multiplying by 0x1000000 (2^24) gives a range of 24 bits.
 */
function randomColorInt() {
  // 24 bits → values from 0 to 16,777,215 (0xFFFFFF)
  return Math.floor(Math.random() * 0x1000000);
}

/**
 * Convert a 24‑bit integer into a hex color string.
 * padStart(6, "0") ensures the hex string is always 6 characters.
 */
function intToHexColor(intValue) {
  // Convert number → hex string (e.g., "3fa2c")
  const hex = intValue.toString(16);

  // Ensure 6 hex digits (e.g., "003fa2c")
  const padded = hex.padStart(6, "0");

  // Add the leading "#"
  return `#${padded}`;
}

/**
 * Produce a random hex color by combining the two functions.
 */
function generateRandomHexColor() {
  const value = randomColorInt();     // 24‑bit random number
  const hexColor = intToHexColor(value); // Convert to #RRGGBB
  
  return { value, hexColor };
}

// Run the program
const result = generateRandomHexColor();
console.log("Random 24‑bit value:", result.value);
console.log("Hex color:", result.hexColor);


/*
run:

Random 24‑bit value: 8950214
Hex color: #8891c6

*/

 

70+ SQL courses for beginners and professionals

Answer 6

/**
 * Generates a random hex color code in the format #RRGGBB
 * @returns {string} Random hex color
 */
function getRandomHexColor() {
    // Generate a random integer between 0 and 0xFFFFFF (16777215)
    const randomInt = Math.floor(Math.random() * 0xFFFFFF);

    // Convert to hexadecimal and pad with leading zeros if needed
    const hexColor = "#" + randomInt.toString(16).padStart(6, "0");

    return hexColor;
}

// Example usage:
console.log(getRandomHexColor()); 


/*
run:

#497ca8

*/

 

70+ SQL courses for beginners and professionals