Go Down

Topic: Color variable (Read 3169 times) previous topic - next topic


Is there a way to pass color variable from dashboard to arduino? I was looking around and can't seem to find an answer.

Thanks for any help!


Are you asking about the "Color HSB" property? The HSB values you set using the color picker are available in your Arduino sketch via the variable name you configured when you added that property. If you have any questions about how to use that variable, let me know.


Aug 26, 2019, 11:03 pm Last Edit: Aug 26, 2019, 11:20 pm by Zbyslaw
Thanks for help and sorry for late reply.

How can I for example set rgb led color to that from cloud? Can I get R,G and B values [edit:or individual H, S and B]? How to get them?



Aug 27, 2019, 05:42 am Last Edit: Aug 27, 2019, 12:42 pm by pert
Since I don't know which type of LED you're using and if you're using a library with it, I'll show you how to get both the HSB values and the RGB values and print them to the Arduino Web Editor's Monitor.

Create a thing.

Add a "Color HSB" property to the thing. The example code I am going to share assumes the variable name you chose is color. If you prefer a different variable name, you only need to adjust that part of the example code.

Click the "Edit Sketch" button.

Add the following code to the onColorpickerChange function:
Code: [Select]

  Serial.print("Hue = ");
  Serial.print("Saturation = ");
  Serial.print("Brightness = ");
  // convert HSB to RGB
  // declare the variables to store the RGB values
  Color currentColor=Color(color.getValue().hue, color.getValue().sat, color.getValue().bri); // declare a variable of the Color data type and define it using the HSB values of the color variable
  byte RValue;
  byte GValue;
  byte BValue;
  currentColor.getRGB(RValue, GValue, BValue);  // the variables will contain the RGB values after the function returns
  Serial.print("R = ");
  Serial.print("G = ");
  Serial.print("B = ");

Click the "Secret" tab.

Fill in the SSID and password for your WiFi router.

Make sure your board is selected in the board menu at the top of the Arduino Web Editor window.

Click the upload button (rightward pointing arrow).

Wait for the upload to finish.

From the menu on the left side of the screen, click "Monitor".

Right click the "Go to IoT Cloud" button.

Click "Open link in new window".

Click the "Dashboard" tab.

You'll see a square color swatch labeled with the name you gave your "Color HSB" property.

Click twice on the square of color to show the color picker. Normally you only need to click the color swatch once to show/hide the color picker, but the first time you need to click it twice.

Use the mouse pointer to select your color from the color picker.

Click on the color swatch outside the picker area to change to the color you picked.

Switch to the browser window that has Arduino Web Editor open. You should see the HSB and RGB values of both the initial color and the new color you picked displayed in the Monitor window.



You're welcome. I'm glad if I was able to be of assistance. Enjoy!


Hi, I also found this information very useful having tried all sorts of things to extract values for hsv from the color variable. Where did you get the information on the "color.getValue" and the correct syntax to use? If you don't know the places to go to get such information it makes things difficult to learn - and I did try various searches without any joy until I found this thread.


Unfortunately I'm not aware of any documentation or example sketches that demonstrate how to do this. I figured it out by looking at the source code of the ArduinoCloudThing library to learn how to do it. In this case, it was in CloudColor.h:

Go Up