# Controlp5 (cp5): Sync color displayed by colorwheel when variable is changed

**URL:** <https://discourse.processing.org/t/controlp5-cp5-sync-color-displayed-by-colorwheel-when-variable-is-changed/29775>\
**Category:** Libraries\
**Created:** [May 1, 2021, 12:54pm UTC](https://discourse.processing.org/t/controlp5-cp5-sync-color-displayed-by-colorwheel-when-variable-is-changed/29775 "2021-05-01T12:54:55Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Len](https://avatars.discourse-cdn.com/v4/letter/l/58f4c7/32.png) [@Len](https://discourse.processing.org/u/Len)\
**Post date:** [May 1, 2021, 12:54pm UTC](https://discourse.processing.org/t/controlp5-cp5-sync-color-displayed-by-colorwheel-when-variable-is-changed/29775/1 "2021-05-01T12:54:55Z")

</div>

I use a colorwheel in my sketch to change the background color. I also have a key set to choose and set random background color from an array. I would like the color wheel to update and display the actual background color when it is changed via the key event. But the colorwheel only displays the last color it was manually set too.

I tried this:  
`cp5.getController("colorWheel").setValue(currentBackgroundColor)` but it yields no result.

I also fiddled with `setRGB()` instead of `setValue()`. But to no result. Sliders & Knobs sync seamlessly via setValue() when their variables are changed through keys. I might just miss a tiny detail here but im new to Processing and especially Controlp5. And searching the web did not help much.

---

<div class="post-metadata">

**Author:** ![MiguelSanches](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/miguelsanches/32/11172_2.png) [@MiguelSanches](https://discourse.processing.org/u/MiguelSanches)\
**Post date:** [May 1, 2021, 4:33pm UTC](https://discourse.processing.org/t/controlp5-cp5-sync-color-displayed-by-colorwheel-when-variable-is-changed/29775/2 "2021-05-01T16:33:12Z")

</div>

Hi @Len,

Welcome to the community!

It helps to troubleshoot your problem if you post your code.  
Anyway, please find my attempt to solve your problem in the code below:

```auto
import controlP5.*;

ControlP5 cp5;

void setup() {
  size(800, 400);
  cp5 = new ControlP5( this );
  cp5.addColorWheel("c" , 250 , 10 , 200 ).setRGB(color(128,0,255));
  noStroke();
}
  
int c = color(100);

void draw() {  
  background(50);
  fill( c );
  rect(0,240,width,200);
   //println(cp5.get(ColorWheel.class,"c").getRGB()); 
}

void keyPressed(){
 color keyColor = color(0);
 switch(key){
   case 'r':
   keyColor = color(255,0,0);
   break;
   case 'g':
   keyColor = color(0,255,0);
   break;
   case 'b':
   keyColor = color(0,0,255);
   break;
 }
 cp5.get(ColorWheel.class,"c").setRGB(keyColor);
}

```

Hope it helps!

---

<div class="post-metadata">

**Author:** ![Len](https://avatars.discourse-cdn.com/v4/letter/l/58f4c7/32.png) [@Len](https://discourse.processing.org/u/Len)\
**Post date:** [May 1, 2021, 4:40pm UTC](https://discourse.processing.org/t/controlp5-cp5-sync-color-displayed-by-colorwheel-when-variable-is-changed/29775/3 "2021-05-01T16:40:42Z")

</div>

Perfect solution! Thank you so much. 🙏