# Fixing color to squares with eyedropper

**URL:** <https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508>\
**Category:** Coding Questions\
**Created:** [November 18, 2020, 11:32am UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508 "2020-11-18T11:32:13Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![scooijmans](https://avatars.discourse-cdn.com/v4/letter/s/b487fb/32.png) [@scooijmans](https://discourse.processing.org/u/scooijmans)\
**Post date:** [November 18, 2020, 11:32am UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/1 "2020-11-18T11:32:13Z")

</div>

Hi, I’m not very good at processing and am stuck with this code.  
I drew 5 squares with the color of the x and y position of the mouse. Next, I want to state that with the first mouseclick the color the mouse is on at that moment will be fixed in the first square. and the second click has to fill the second square with the color of the mouse position. Anyone have any clue how to do this? thank so much in advance!

```auto
PImage salad;
import processing.pdf.*;
boolean record;

void setup(){
  size(875, 875);
  noStroke();
  salad = loadImage("salad.jpg");
}

void draw() {
  if(record){
    beginRecord(PDF, "frame-####.pdf");
  }
  image(salad, 0,0);
  color a = get (mouseX, mouseY);
  color b = get (mouseX, mouseY);
  color c = get (mouseX, mouseY);
  color d = get (mouseX, mouseY);
  color e = get (mouseX, mouseY);
  fill(a);
  rect(100,100,100,100);
  fill(b);
  rect(100,250,100,100);
  fill(c);
  rect(100,400,100,100);
  fill(d);
  rect(100,550,100,100);
  fill(e);
  rect(100,700,100,100);
  
  if(record){
    endRecord();
    record = false;
  }
}

void mouseClicked() { //I want the square filled in with the color my mouse is on at that time
  
}

void keyPressed() { //if you press enter the frame gets saved as a pdf
  record = true; 
}

```

---

<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:** [November 18, 2020, 12:22pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/2 "2020-11-18T12:22:50Z")

</div>

before setup  
int counter;

**define all colors before setup**

color a,b,c,d,e;

it’s all black then

OR

`color a=color(111),b=color(255,0,0),c,d,e;` iirc

then in function `mouseClicked() ` or mousePressed() say

```auto
counter ++

if(counter==0)
a=....;
else if(counter==1)
b=......;
else if.....
....
....

```

---

<div class="post-metadata">

**Author:** ![scooijmans](https://avatars.discourse-cdn.com/v4/letter/s/b487fb/32.png) [@scooijmans](https://discourse.processing.org/u/scooijmans)\
**Post date:** [November 18, 2020, 1:37pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/3 "2020-11-18T13:37:26Z")

</div>

Thank you so much for your help this is really nice. but I’m wondering do I have to call the different rectangles on the dots after a = … ?  
because then the rect’s should have different names or not? idk how to change that.

---

<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:** [November 18, 2020, 1:40pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/4 "2020-11-18T13:40:38Z")

</div>

> [@scooijmans](#):
>
> do I have to call the different rectangles

this entire section stays the same in `draw()`:

> [@scooijmans](#):
>
> ```auto
> fill(a);
> rect(100,100,100,100);
> fill(b);
> rect(100,250,100,100);
> fill(c);
> rect(100,400,100,100);
> fill(d);
> rect(100,550,100,100);
> fill(e);
> rect(100,700,100,100);
>   
> 
> ```

I am sorry!

---

<div class="post-metadata">

**Author:** ![scooijmans](https://avatars.discourse-cdn.com/v4/letter/s/b487fb/32.png) [@scooijmans](https://discourse.processing.org/u/scooijmans)\
**Post date:** [November 18, 2020, 1:44pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/5 "2020-11-18T13:44:22Z")

</div>

Yeah, but it’s saying it needs a variable there… i don’t know which one haha

---

<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:** [November 18, 2020, 1:44pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/6 "2020-11-18T13:44:58Z")

</div>

show your entire code then

---

<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:** [November 18, 2020, 1:48pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/7 "2020-11-18T13:48:54Z")

</div>

basically when you say color a,b,c… before setup,

don’t declare a,b,c… somewhere else

so in mouseClicked() just say `a = .............` NOT `color a =.......`

also in draw() don’t say `color a = ....`

---

<div class="post-metadata">

**Author:** ![scooijmans](https://avatars.discourse-cdn.com/v4/letter/s/b487fb/32.png) [@scooijmans](https://discourse.processing.org/u/scooijmans)\
**Post date:** [November 18, 2020, 1:53pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/8 "2020-11-18T13:53:47Z")

</div>

Aaah right! that was the mistake, still had the colors in draw…  
that’s amazing thank you!  
do you think there is a possibility to still see the colors in the squares when the mouse is hovering over the image, before the click. so you can realy select a color?

---

<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:** [November 18, 2020, 1:55pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/9 "2020-11-18T13:55:53Z")

</div>

> [@scooijmans](#):
>
> still see the colors in the squares when the mouse is hovering over the image

I think you need this section then in draw before the rects

```auto
if(counter==0)
a=....;
else if(counter==1)
b=......;
else if.....
....
....

```

BUT without the counter++; of course

---

<div class="post-metadata">

**Author:** ![scooijmans](https://avatars.discourse-cdn.com/v4/letter/s/b487fb/32.png) [@scooijmans](https://discourse.processing.org/u/scooijmans)\
**Post date:** [November 18, 2020, 1:59pm UTC](https://discourse.processing.org/t/fixing-color-to-squares-with-eyedropper/25508/10 "2020-11-18T13:59:05Z")

</div>

wauw i got it, thank you so much for your help!