O André Victor propôs um exercício para que eu treinasse mais um pouco. A ideia era gerar bolinhas coloridas aleatoriamente com todas as cores possíveis. Como sempre, dei aquela pesquisada e aprendi bastante com esse desafio. Abaixo segue o código que fiz. Para quem quiser entender ou aprender um pouco sobre as cores digitais e como sua matemática e padrões funcionam, vou deixar o link aqui de um site. Vale a leitura.
abs : )
https://dicasdeprogramacao.com.br/as-10-conversoes-numericas-mais-utilizadas-na-computacao/
<DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Colorful Balls</title>
<link rel="icon" href="icon.png">
</head>
<body>
<canvas width="600" height="400"></canvas>
<script>
let screen = document.querySelector("canvas");
let brush = screen.getContext("2d");
brush.fillStyle = "white";
brush.fillRect(0, 0, 600, 400);
brush.fillStroke = "black";
brush.strokeRect(0, 0, 600, 400);
function toDrawColorfulBalls(event) {
let x = event.pageX - screen.offsetLeft;
let y = event.pageY - screen.offsetTop;
let hexadecimal = "0123456789ABCDEF";
let color = "#";
for(let i = 0; i < 6; i++) {
color = color + hexadecimal[Math.floor(Math.random() * 16)];
}
brush.fillStyle = color;
brush.beginPath();
brush.arc(x, y, 10, 0, 2 * 3.14);
brush.fill();
console.log(color);
return false;
}
screen.oncontextmenu = toDrawColorfulBalls;
screen.onclick = toDrawColorfulBalls;
</script>
</body>
</html> 