JavaScript Random Color Generator I made a page to generate a random color with JavaScript and set that color to the background of the page. 



//Global Variables
const hexChars = '0123456789ABCDEF';
const container = document.getElementById('container');
const hexText = document.getElementById('hex-text');

//Function to generate random hex code

function randomColor() {
 let hexCode = '#';
 for(i=0; i&lt;=5; i++) {
   let randomNum = Math.floor(Math.random() * 16);
    hexCode += hexChars[randomNum];
  }
  return hexCode;
}

//Function to change page color &amp; text

function applyColor() {
  let hexCode = randomColor();
 container.style.backgroundColor = hexCode;
  hexText.innerHTML = hexCode;
}

//Make random color on page load, click, and spacebar press.
window.onload = applyColor();
container.onclick = () =&gt; applyColor();
document.body.onkeyup = e =&gt; {
  if(e.keyCode == 32) {
    applyColor();
  }
}
* {
  margin: 0;
  padding: 0;
  user-select: none;
}

#container {
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color .4s;
}

#hex-text {
  font-family: sans-serif;
  font-size: 2em;
  color: white;
  background-color: rgba(150, 150, 150, .6);
  padding: .4em;
  border-radius: 6px;
}
&lt;div id="container"&gt;
  &lt;p id="hex-text"&gt;
    #000000
  &lt;/p&gt;
&lt;/div&gt;




How can I improve the efficiency or functionality of the JavaScript?  

Edit: I'd also like to know if this is a fair generator, or if it's more likely to get one shade than another. I don't see why it would, but you never know.
Looks very good. And, as far as I know, your colour generator is fair.

For efficiency

you don't need to generate a random number for every hex character. You are choosing among 256^3 (16&nbsp;777&nbsp;216) colours, labeled with every number from 0x0 (0 in decimal) to 0xFFFFFF (256^3-1 in decimal, or 16&nbsp;777&nbsp;215).

So you can:


generate a random number let randomNum = Math.floor(Math.random() * 16777216) // 256^3
use an inherent function for JavaScript Numbers, toString, to convert it to a string with an arbitrary radix: 
let hextest = randomNum.toString(16)

By design, randomNum is a natural number (non-negative or 0) so you don't need code for validation).
pad it with zeros. This question was asked a million times in Stack Overflow (this is only an example).

For your example, where you don't need validation, hextest = ('00000' + hextest).substr(-6) will do. (After padding with all the zeros you'd ever need, picks only the last 6 characters.)
convert to uppercase and decorate: hextest = '#' + hextest.toUppercase(). Reference for toUpperCase()


This way you can get rid of the hexChars constant.

For functionality

I don't have any good idea on how to add functions. But I can suggest an improvement:

in the code you have to capture spacebar presses, add the line e.preventDefault(). This will prevent the default behaviour for the space key (which is scrolling a screen down).

That way, you can add all the content you want to your page without fear of accidentally scrolling down (and it won't scroll down Code Review when I try your embedded snippet, either).