Creazione e uso di palette con gradienti

// height=100 lines=auto
function setup() {
    colorMode( HSL, 360,100,100 );
    // crea la palette di 20 gradazioni
    var palette = [];
    for (var n = 0;  n < 20;  ++n) {
        palette[n] = color( 30, 100, n*5 );
    }
    // disegna barre colorate
    noStroke();
    for (var x = 0;  x < width;  x += 5) {
        var c = map( x, 0,width, 0,palette.length );
        fill( palette[ int(c) ] );
        rect( x,0, 5,100 );
    }
}
colorMode( HSL, 360,100,100 );

Uso della modalità cromatica HSL per rendere più semplice la variazione di luminosità di un determinato colore.

palette[n] = color( 30, 100, n*5 );

Colore sempre arancione (30), al massimo della saturazione (100) e con un valore di luminosità variabile da 0 (0*5) a 95 (19*5).

Provare a intervenire sui parametri della funzione color() usando la variabile n per ottenere un gradiente con luminosità media e variazione della saturazione: Sfumatura da grigio ad arancione.