You could use rgba instead of hex.

Something like this:

function getRandomValue(){
  for (var i = 0; i < 3; i++) 
  {
     return Math.random() * (255 - 0) + 0; //Don't know how random works
  }  
}


function getRandomColor() 
{
  var letters = '0123456789ABCDEF';
  var color = 'rgba';
  color += `(${getRandomValue()},${getRandomValue()},${getRandomValue()}`;
  return color;
}

Or try using opacity in CSS

Short answer: full table of percentages

You can see the full table of percentages to hex values and run the code in this playground in

• Golang https://play.golang.org/p/l1JaPYFzDkI .
• Kotlin https://pl.kotl.in/o9BnFYhRn

Ok the table tells the results not how to find the results. The next parts explain how you can calculate yourself.

Short explanation in pseudocode

Percentage to hex values

1. decimal = percentage * 255 / 100 . ex : decimal = 50*255/100 = 127.5
2. convert decimal to hexadecimal value . ex: 127.5 in decimal = 7*16ˆ1 + 15 = 7F in hexadecimal

Hex values to percentage

1. convert the hexaxdecimal value to decimal. ex: D6 = 13*16ˆ1 + 6 = 214
2. percentage = (value in decimal ) * 100 / 255. ex : 214 *100/255 = 84%

More infos for the conversion decimal <=> hexadecimal

Long answer: how to calculate in your head

The problem can be solved generically by a cross multiplication.

We have a percentage (ranging from 0 to 100 ) and another number (ranging from 0 to 255) then converted to hexadecimal.

• 100 <==> 255 (FF in hexadecimal)
• 0 <==> 0 (00 in hexadecimal)

For 1%

• 1 * 255 / 100 = 2,5
• 2,5 in hexa is 2 if you round it down.

For 2%

• 2 * 255 / 100 = 5
• 5 in hexa is 5 .

The table in the best answer gives the percentage by step of 5%.

How to calculate the numbers between in your head ? Due to the 2.5 increment, add 2 to the first and 3 to the next

• 95% — F2 // start
• 96% — F4 // add 2 to F2
• 97% — F7 // add 3 . Or F2 + 5 = F7
• 98% — F9 // add 2
• 99% — FC // add 3. 9 + 3 = 12 in hexa : C
• 100% — FF // add 2

I prefer to teach how to find the solution rather than showing an answer table you don't know where the results come from.

Give a man a fish and you feed him for a day; teach a man to fish and you feed him for a lifetime