Code I Use

var fillR = 255;
var fillG = 0;
var fillB = 0;
var increment = 20
 
function incrementColor()
{
    if (fillR == 255) {
        if (fillB > 0) {
            fillB = fillB - increment;
            if (fillB < 0) { fillB = 0; }
        }
        else {
            fillG = fillG + increment;
            if (fillG > 255) { fillG = 255; }
        }
    }
 
    if (fillG == 255) {
        if (fillR > 0) {
            fillR = fillR - increment;
            if (fillR < 0) { fillR = 0; }
        }
        else {
            fillB = fillB + increment;
            if (fillB > 255) { fillB = 255; }
        }
    }
 
    if (fillB == 255) {
        if (fillG > 0) {
            fillG = fillG - increment;
            if (fillG < 0) { fillG = 0; }
        }
        else {
            fillR = fillR + increment;
            if (fillR > 255) { fillR = 255; }
        }
    }
    var canvas = document.getElementById(“myCanvas”),
                    context = canvas.getContext(“2d”);
    context.fillStyle = “rgb(” + fillR + “,” + fillG + “,” + fillB + “)”;
}