Hello !

I am a beginner on processing, I need to make a moving gradient with 3 RGB codes.
pink: 247,211,237
blue: 156,217,204
white: 255,251,233

I found this code here : https://happycoding.io/examples/processing/for-loops/bouncing-gradient by happy coding.io:

``````float redX;
float redY;
float redXSpeed;
float redYSpeed;

float greenX;
float greenY;
float greenXSpeed;
float greenYSpeed;

float blueX;
float blueY;
float blueXSpeed;
float blueYSpeed;

void setup() {
size(256, 256);
noSmooth();

redX = random(width);
redY = random(height);
redXSpeed = random(-1, 1);
redYSpeed = random(-1, 1);

greenX = random(width);
greenY = random(height);
greenXSpeed = random(-1, 1);
greenYSpeed = random(-1, 1);

blueX = random(width);
blueY = random(height);
blueXSpeed = random(-1, 1);
blueYSpeed = random(-1, 1);
}

void draw() {

redX += redXSpeed;
redY += redYSpeed;
if (redX < 0 || redX > width) {
redXSpeed *= -1;
}
if (redY < 0 || redY > height) {
redYSpeed *= -1;
}

greenX += greenXSpeed;
greenY += greenYSpeed;
if (greenX < 0 || greenX > width) {
greenXSpeed *= -1;
}
if (greenY < 0 || greenY > height) {
greenYSpeed *= -1;
}

blueX += blueXSpeed;
blueY += blueYSpeed;
if (blueX < 0 || blueX > width) {
blueXSpeed *= -1;
}
if (blueY < 0 || blueY > height) {
blueYSpeed *= -1;
}

for (int y = 0; y < height; y++) {
for (int x = 0; x < width; x++) {
float redDistance = dist(x, y, redX, redY);
float greenDistance = dist(x, y, greenX, greenY);
float blueDistance = dist(x, y, blueX, blueY);

stroke(redDistance, greenDistance, blueDistance);
point(x, y);
}
}
}
``````

I would like to be able to put my colors instead of red, blue and geen, how can I do?
also when I try to adapt the size of the sketch to my screen it destroys the visual how can I do to adapt it?

Thank you very much for your help!! i really need to understand

I want to make this :

This additional resource may be of help:

2 Likes

Hello ! thank you for your answer I will study this thankkssss

In setup, change this:

To this:

``````void setup() {
size(400, 400);
noSmooth();
colorMode(RGB, 400);
``````

Of note, this section:

â€śFor example, calling colorMode(RGB, 1.0) will specify that values are specified between 0 and 1. The limits for defining colors are altered by setting the parameters max , max1 , max2 , max3 , and maxA .â€ť

However, I do not know specifically, what is happening under the hoodâ€¦
Is this â€śmaxâ€ť a variable being mapped to, without explicitly calling the map function?