[Projeto] Apenas divulgando

Fiz o código ainda mais aprimorado. Além de andar pelas setas, usei o Shift para aumentar o raio, o ctrl para diminuir o raio e também o alt para alterar a cor da bolinha

<script>

            var tela = document.querySelector('canvas');
            var pincel = tela.getContext('2d');
            pincel.fillStyle = 'lightgray';
            pincel.fillRect(0, 0, 600, 400);




              //posição da bolinha
              var x = 20;
              var y = 20;

              // códigos do teclado
              var esquerda = 37;
              var cima = 38;
              var direita = 39;
              var baixo = 40;

              //taxa incremento dos eixos
              var taxa=10;

              // raio 
              var raio=10;

              // cores
              var cores=['blue','green','red','purple','pink','orange'];
              var posicao=0;

              function desenhaCirculo(x, y, raio) {

                  pincel.fillStyle = cores[posicao];
                  pincel.beginPath();
                  pincel.arc(x, y, raio, 0, 2 * Math.PI);
                  pincel.fill();
              }

              function limpaTela() {

                  pincel.clearRect(0, 0, 600, 400);
              }

              function atualizaTela() {

                  limpaTela();
                  desenhaCirculo(x, y, raio);
              }

              function leDoTeclado(evento) {

                  if(evento.altKey) {
                    posicao++;
                      if(posicao == cores.length) {
                        posicao=0;
                      }
                  }


                  if(evento.shiftKey) {
                    raio=raio+10;
                  }

                  if(evento.ctrlKey && raio>=20) {
                    raio=raio-10;
                  }

                  if(evento.keyCode==cima) {

                    y=y-taxa;
                  }

                  if(evento.keyCode==baixo) {

                    y=y+taxa;
                  }

                  if(evento.keyCode==esquerda){
                    x=x-taxa;
                  }

                  if(evento.keyCode==direita) {
                    x=x+taxa;
                  }

                  console.log(evento.keyCode);
              }


             setInterval(atualizaTela, 20);
             document.onkeydown = leDoTeclado; 

   </script>