Changing Colours after X iterations

Hi guys,

So essentially I’m trying to figure out how to cycle through colours assigned within an array.
I would like for every 50 frames/iterations, for the colour to change to the next one in the array (ie, 0-50 = yellow, 51-100 = lightBlue etc…)

Code below is where I’ve got with it.

How can this be done? Is a while loop even necessary/correct or are there other more appropriate ways? I’m new to Processing so apologies in advance!


color yellow = #ede777;
color lightBlue = #49cae8;
color blue = #3a55d8;
color grey = #aaaaaa;
color darkGrey = #555555;
color brown = #664d31;
color pink = #e57797;
color burgundy = #960909;
color crimson = #e03b3b;
color violet = #d58aed;
color green = #99dd64;

int[] colors = {yellow, lightBlue, blue, grey, darkGrey, brown, pink, burgundy, crimson, violet, green};

void setup() {
  size(600, 600);
  translate(width/2, height/2);

void draw() {

  int i = 0;
  while (i <= 50) {
square(width/2, height/2, 100);
1 Like


Welcome to the Processing forum.

Check out all the basic tutorials, references, etc. on the Processing site.

draw() updates every 1/60 of a second; default frameRate is 60 fps.

Your while() loop is not doing anything other than selecting LightBlue 51 times.

Explore these references: This operator is useful and worth the investment in learning!

Example code (you will begin to understand this after reading references):

//GLV Template

void setup() 
  size(200, 200);

void draw() 

  if (frameCount%10 == 0) 
   // Do something! 
   // print frameCount to the console to see what this is doing.
   // Increment a counter and use that to access the element of an array.


1 Like