AS3 Circle Color Spectrum

Just a few days ago I released my HSB Color Wheel interface. All the graphics used in there are drawn with the AS3 drawing API including the circle color spectrum and the circle gradient. This performs very well but just out of curiosity I wondered how hard it would be to generate the color spectrum in pixel bender … and well it’s not that complicated, actually it’s easier than doing it in AS3 because pixel bender is made for dealing with colors and pixels.

I implemented a few parameter to control the shader

  • center for passing in the x and y
  • innerRadius and outerRadius for controling the size of the circle
  • rotation (0-360) to change the angle where the red color starts
  • ratio (0.0-1.0) for controling the space used for 1 color spectrum, e.g. a value of 0.5 would use 180 degrees for displaying 1 spectrum and you would end up with 2 spectrums in your circle

is it just me or does the circle in the middle seem to rotate slightly … scary … anyway

Play with the filter…
Download Circle Color Spectrum filter & pixel bender source

next up:
AS3 Circle Gradient

5 Responses (Add Your Comment)

  1. This looks awesome. Can we get the source?


  2. Lol. I see the link now :)

  3. hey martin.
    looks great. but i have no clue about pixelbender. you wrote that this is done with as3. but your source is some kind of xml. can this stuff be done with just as3?

    what do you use pb for?

  4. hey kweso,

    basically i needed a circle color spectrum for my HSB Color Wheel (you can find the code in the previous post). as written above I did everything in pure AS3 in the first place … just out of curiosity I created a filter with pixelbender to generate the color spectrum.


Leave a Reply

Formatting: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Other Entries


Martin Rädlinger is an Interactive Developer & Designer. He specializes in interactive coding predominantly with ActionScript, but every new challenge is welcome. If you like his work feel free to get in touch with him. At the moment he's available for freelance work.


Martin Rädlinger
mail: mr [at]
xing: Martin Rädlinger
linkedin: Martin Rädlinger
skype: martinraedlinger