Skip to main content

Colour Picker

The Colour Picker UI component allows users to send values assocated with RGB or RGBW values in a range of 0 to 255. The colour picker features a luminosity slider used to proportionally change the output value of the UI component.

To customise the UI component, navigate to the Style tab.

Set the colour theme, show or hide the border and select from a flat or rounded border edge style.

Protocols​

The Protocols tab allows multple protocols and destinations to be defined and sent from Ctrl Suite on:

  • Change (When any value on the component is changed)
  • Touch Begin (When the user first touches the component)
  • Touch End (When the user stops interacting with the component)

Define protocol types to be sent, select a patch, then enter variables from the list below as part of the command you define within the "Message" field. - These values will be updated with every interaction of the UI component.

  • $hex - Hexidecimal [000000..ffffff] - (i.e. c561ff)
  • $r - Red [0..255] - (i.e. 127)
  • $g - Green [0..255] - (i.e. 127)
  • $b - Blue [0..255] - (i.e. 127)
  • $w - White [0..255] - (i.e. 127)
  • $h - Hue [0..255] - (i.e. 127) - Note that the Whte slider in RGBW doesn't impact HSV.
  • $s - Saturation [0..100]- (i.e. 50) - Note that the Whte slider in RGBW doesn't impact HSV.
  • $v - Value [0..100] - (i.e. 50) - Note that the Whte slider in RGBW doesn't impact HSV.

Settings​

The Settings tab allows selection between an RGB or RGBW colour picker (default is RGB). Selecting RGBW enables an additional White slider on the UI component.

Interact with the Colour Picker UI component's appearance remotely with timers, external protocols or other remote logic, to lock it out, change the size, position appearance and more by creating a Process adding relevant Interface blocks in combination with Render Components.