Diseñando con el mouse.hasta donde he alcanzado

Hola Wilmer.

Primero tenés que tener un evento como el siguiente y que llame a la función que cambia colores: pantalla.onclick = cambiarColor

Luego declarar la función que cambia colores, en cada linea te pongo los comentarios para explicarlo:

function cambiarColor(evento) {
        var x = evento.pageX - pantalla.offsetLeft; // toma el eje x donde hizo click
        var y = evento.pageY - pantalla.offsetTop; // toma el eje x donde hizo click

// y aquí colocar los condicionales, preguntando si el click está dentro del cuadrado de la paleta de cada color
            if ((x < 50) && (y < 50))  {
                 colorActual = "red";
                }  
            else if ((x > 50) && (x < 100) && (y < 50)) {
                colorActual = "green";
            }    
            else if ((x > 100) && (x < 150) && (y < 50)) {
                colorActual = "blue";
            }  
    }

Espero haber sido de ayudar. Saludos!

muchas gracias

Por nada. Si te sirvió la respuesta no olvidés marcarla como "solucionado" por si otro compañero tiene la misma consulta.

Saludos!