• Adobe After Effects Expressions

  AE scripting: using the colorpicker

  Posted by James Primhak on May 2, 2013 at 4:30 pm

  $.colorPicker();

  Hello, I am writing a script that uses the above code. Firstly, does anyone know if there is a way to access AEs internal color picker instead as that would be preferable. Secondly, if that is not possible, does anyone know what format the returned value from this is and how one would convert it to 8-bit RGB values? If I check it now its giving me an 8 digit number. For example red (255,0,0) is 16711680. If I treat it as hex, from piecing bits together from the internet, I wrote the following:

  var defaultColor = 0xff0000;
  var myHexColor = $.colorPicker();
  var myDecColor = myHexColor.toString(16);
  var bigint = parseInt(myDecColor, 16);
  var r = (bigint >> 16) & 255;
  var g = (bigint >> 8) & 255;
  var b = bigint & 255;
  myRgbColor = [(r/255),(g/255),(b/255)]

  which at first I thought worked, but it doesn’t quite. HELP!

  Thanks in advance,

  James

  Michael Mathes replied 2 years, 5 months ago 4 Members · 14 Replies
• 14 Replies

• 

  Dan Ebberts

  May 2, 2013 at 8:41 pm

  I think you’re close. Try this:

  var defaultColor = 0xff0000;
  var myHexColor = $.colorPicker();
  var r = myHexColor >> 16;
  var g = (myHexColor & 0x00ff00) >> 8;
  var b = myHexColor & 0xff;
  myRgbColor = [r/255,g/255,b/255,1];

  Dan
• 

  James Primhak

  May 8, 2013 at 4:27 pm

  Hi Dan,

  I have realised that the code works OK, but weirdly, it seems to be the system colorpicker that doesn’t work. If I make a test UI panel using the code below, it works fine, unless you use the magnifying glass element of the system colorpicker. If you enter the values manually into the RGB sliders it returns the correct result, but if you try to pick say the grey of the AE interface, it returns RGB values of (84,84,84) (for example), but then the decimal value that is returned is incorrect and so the RGB values my code end up being something like (62,62,62). Also, from that point on ALL colors entered are incorrect, unless I quit AE and start again. Do you get whats going on? Am I missing something really obvious?

  Thanks in advance,

  James

  MY CODE:

  {
  var myPanel;

  function Create_Null(thisObj)
  {
  myPanel = (thisObj instanceof Panel) ? thisObj : new Window(“palette”, “Test Color”, [100, 100, 300, 300]);

  myPanel.butCreate = myPanel.add(“button”, [05, 10, 200, 30], “Test Color” );

  myPanel.butCreate.onClick=TestColor;
  return myPanel;
  }

  function TestColor()
  {
  app.beginUndoGroup(“Test Color”);

  var myDecColor = 0;
  var myDecColor = $.colorPicker();

  var myHexColor = myDecColor.toString(16);

  r = HexToR(myHexColor);
  g = HexToG(myHexColor);
  b = HexToB(myHexColor);

  function HexToR(h) {return parseInt((cutHex(h)).substring(0,2),16)}
  function HexToG(h) {return parseInt((cutHex(h)).substring(2,4),16)}
  function HexToB(h) {return parseInt((cutHex(h)).substring(4,6),16)}
  function cutHex(h) {return (h.charAt(0)==”#”) ? h.substring(1,7):h}

  alert(“decimal = ” + myDecColor + “, hex = ” + myHexColor + “, RGB = ” + r + ‘, ‘ + g + ‘, ‘ + b);

  app.endUndoGroup();
  }

  Create_Null(this);

  }
• 

  Dan Ebberts

  May 8, 2013 at 5:32 pm

  I haven’t tested your code, but it looks like you’ve made things unnecessarily complicated. The result of $.colorPicker() has the rbg value nicely packed into 8-bit chunks, so all you need to do is use bit-wise operations to isolate each channel. Do you get the same issues doing it this way?

  var myDecColor = $.colorPicker();
  var r = myDecColor >> 16;
  var g = (myDecColor & 0x00ff00) >> 8;
  var b = myDecColor & 0xff;
  alert(“decimal = ” + myDecColor + “, hex = ” + myDecColor.toString(16) + “, RGB = ” + r + ‘, ‘ + g + ‘, ‘ + b);

  Dan
• 

  James Primhak

  May 9, 2013 at 8:30 am

  Hi Dan,

  Thanks for getting back to me. I get the same result using that code. It works fine apart from the magnifying glass part. Whats strange is that if i dont do any kind of conversion to the colorpicker value at all the decimal value it returns is wrong (when I use the magnifying glass thing). So if I use the code:

  var myDecColor = $.colorPicker();
  alert(“decimal = ” + myDecColor);

  and colorpick an rgb value of (84,84,84), I get 4342338, whereas I believe it should be 5526612. Wierd.
• 

  Tim Hildebrandt

  July 13, 2017 at 3:52 pm

  I know it’s old, but is there ANY way to include the native AE color picker inside a script?

  I know, there’s showColorPicker() for Photoshop and so on, but not for After Effects.

  Actually I don’t want to include the color picker inside a window. Just showing it on a button-click.

  Thank you for your help!
  Tim
• 

  Dan Ebberts

  July 13, 2017 at 4:37 pm

  I don’t believe so. I’d love to be proven wrong though.

  Dan
• 

  Tim Hildebrandt

  July 25, 2017 at 2:21 pm

  I could manage it, to find a work around. I create a new layer inside the active comp (if there is none, create one), apply the “ADBE Color Control” and execute the “edit value” command through AE. This brings the default AE color picker with the name “color” to screen. Select color, the layer is removed and the picked color is extracted.

  It’s not perfect, but it works.

  Tim
• 

  Michael Mathes

  February 13, 2024 at 4:29 pm

  Did you ever find a solution for this? I’m experiencing this exact thing. It all looks correct in the color picker, correct hex code and everything, but when I convert the returned decimal to a hex using toString(16) it is wrong…
• 

  Dan Ebberts

  February 13, 2024 at 4:58 pm

  It seems to work for me. Do you have a specific example?
• 

  Michael Mathes

  February 13, 2024 at 5:33 pm

  Hi Dan,

  Sure. Here is what I’m doing:

      var dec = $.colorPicker(parseInt(hex.replace("#",""),16));
      alert(dec.toString(16));

  This happens when using the eye drop tool. For example, I’ll select a color that is 6033B0 and it will display 6033B0 in the hex color window of the color picker but when it converts, it turns into 4C1BA0.

Reply to this Discussion! Login or Sign Up