Converting RGB value to Integer

The Problem:

I would like to add a more following function in to the app:

1. Function for converting RGB value to integer. → Show live value on the interface (same like #HEX value) → Able to input the number, and change the color. → Able to pass the current value to another function in my app.

2. Ability to add a blank custom input field into the interfaces (with editable caption) → This doesn’t need to show any value, I’d like that use can able to type input by themselves.

The Solution:

Converting function is pretty simple as below, but I don’t know how to add it into the app…

// convert three r,g,b integers (each 0-255) to a single decimal integer (something between 0 and ~16m)
function colourToNumber(r, g, b) {
  return (r << 16) + (g << 8) + (b);
}

// convert it back again (to a string)
function numberToColour(number) {
  const r = (number & 0xff0000) >> 16;
  const g = (number & 0x00ff00) >> 8;
  const b = (number & 0x0000ff);
  
  return [r, g, b];
  // or eg. return `rgb(${r},${g},${b})`;
}

Could you help me please? contact: [e-mail]

[Passch]

Thank you @Wondermarin 😃

[Wondermarin]

Thank you !

But after I set useColor as “rgb” → I can’t select another color anymore. Could you please check what i did wrong?

https://codesandbox.io/s/heuristic-river-f9htb?file=/src/App.js

thanks

This is related with bug #25, which has already been fixed. The update will be released this week.