HomeОбразованиеRelated VideosMore From: Steve Griffith

Random Colour Generation in JavaScript

12 ratings | 432 views
So, you need to generate some random colours for your webpage? Math.random( ) only provides a decimal value between 0 and 1 but your not sure how to convert that into colours? Want to use 3 digit HEX, 6 digit HEX, rgb( ), hsl( ), rgba( ), or hsla( )? This video covers them all, as well as a discussion of how to improve your performance with Binary values and Bitwise operators when you need to generate a lot of them. Code GIST: https://gist.github.com/prof3ssorSt3v3/e165974416f0c5b7a1f74f64b7020564
Html code for embedding videos on your blog
Text Comments (7)
Rania design (9 months ago)
thank you for a clear Tutorial, it is really helpful. please, what does $ sign mean in front of (r)?
Rania design (9 months ago)
this is my code : for (let i = 0 ; i < myDiv.length; i++){ var r = Math.floor(Math.random() * 255); var g = Math.floor(Math.random() * 255); var b = Math.floor(Math.random() * 255); var color =`rgb(${r}, ${g}, ${b})`; myDiv[i].style.backgroundColor= color;
Rania design (9 months ago)
I am sorry if I did not explain it clearly, I meant I need each div has his own color your code make all div one color and change when we refresh the browser but do not worry I figure it out. I put your code inside the for loop and it works now
Steve Griffith (9 months ago)
The code in this tutorial is designed to generate a new set of colours each time the page loads. So, that is doing what it is supposed to do. I don't understand what your problem is.
Rania design (9 months ago)
thanks a lot, sorry for the offtopic but I have a question please, how do I color each of the six divs and should have its own distinct color. I tried your way and gave all div with the same color and will change when I refresh the page! I would appreciate your help
Steve Griffith (9 months ago)
Here is the link to my tutorial on Template Strings - https://www.youtube.com/watch?v=9SapCazLWpw

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.