# Creating array of colors with lerpColor

**URL:** <https://discourse.processing.org/t/creating-array-of-colors-with-lerpcolor/17554>\
**Category:** Coding Questions\
**Created:** [February 4, 2020, 8:15pm UTC](https://discourse.processing.org/t/creating-array-of-colors-with-lerpcolor/17554 "2020-02-04T20:15:11Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![debxyz](https://avatars.discourse-cdn.com/v4/letter/d/58956e/32.png) [@debxyz](https://discourse.processing.org/u/debxyz)\
**Post date:** [February 4, 2020, 8:15pm UTC](https://discourse.processing.org/t/creating-array-of-colors-with-lerpcolor/17554/1 "2020-02-04T20:15:11Z")

</div>

@Chrisir (I don’t know what happened to my response as I had withdrawn the topic. But am reposting the response here…)

**No problem at all!!**  
I was just now working on this and **have arrived at the following solution.**  
My next step is to streamline the code.

- I would like to be able to incorporate a loop to generate a list of lerped colors so I don’t have to itemize each instance in the variables above setup. I assume this is possible? I may need to ask for help once further along.
- And, variable **float step = 1/(num-2)** doesn’t work as i expected…  
Why isn’t it doing the division?

```auto
int w = 40, h = 400-40;
int num = 9;
float step = .1428;
//float step = 1/(num-2); not sure why this doesn't work??????

Cell [] cells = new Cell [num];

color from = color(random(255), random(255), random(255)); 
color to = color(random(255), random(255), random(255));
color c2 = lerpColor(from, to, step); 
color c3 = lerpColor(from, to, step*2);
color c4 = lerpColor(from, to, step*3);
color c5 = lerpColor(from, to, step*4);
color c6 = lerpColor(from, to, step*5);
color c7 = lerpColor(from, to, step*6);
color c8 = lerpColor(from, to, step*7);

color [] colors =
{
from, c2, c3, c4, c5, c6, c7, c8, to
};

void setup() {
  size (400, 400);
  
  int k = 0;

  for (int i = 0; i < num; i++) {
    cells[i] = new Cell(x+i*w, y, w, h, colors[k]);
    k++;
    }
  }

void draw() {
  
  background (51);

  for (int i = 0; i < num; i++) {
    cells[i].display();
  }
}

```

//////////////////////////

```auto
class Cell {
  float x, y, w, h;
  color clr;

  Cell ( 
    float tempX, float tempY, 
    float tempW, float tempH, color tempClr) {

    x = tempX;
    y = tempY;
    w = tempW;
    h = tempH;
    clr = tempClr;
  }
  void display() {
    
    stroke(255); 
    fill(clr);
    rect(x, y, w, h);
  }
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [February 5, 2020, 8:43am UTC](https://discourse.processing.org/t/creating-array-of-colors-with-lerpcolor/17554/2 "2020-02-05T08:43:26Z")

</div>

> [@debxyz](#):
>
> variable **float step = 1/(num-2)** doesn’t work as i expected…

When we use only int in a formula processing assumes we want int as a result. Bad.

write **float step = 1.0f/(num-2)**

---

<div class="post-metadata">

**Author:** ![debxyz](https://avatars.discourse-cdn.com/v4/letter/d/58956e/32.png) [@debxyz](https://discourse.processing.org/u/debxyz)\
**Post date:** [February 5, 2020, 7:55pm UTC](https://discourse.processing.org/t/creating-array-of-colors-with-lerpcolor/17554/3 "2020-02-05T19:55:24Z")

</div>

I looked up the use of **f** following the float number **1.0** and learned about floating point literals!  
Thank you!!