SwirlingColorWheel.pde

// Swirling Color Wheel
// p.js
//
// Just discovering how to make this effect
// thanks to HSB vs. RGB color mode
//
// Click on the sketch to switch color modes

/* @pjs pauseOnBlur="true"; */

PFont f;
float angle = 0;
boolean mode = false;

void setup() {
  size(400, 400);
  smooth();
  noStroke();
  f = createFont("sans-serif",32);
  textFont(f);
}

void draw() {
  background(255);
  pushMatrix();
  translate(width/2, height/2);
  rotate(radians(angle));
  for (int i = 0; i < 360; i+=10) {
    pushMatrix();
    rotate(radians(i));
    if (mode) colorMode(RGB, 360);
    else colorMode(HSB, 360);
    fill(i, 255, 255, 20);
    rect(0, 0, width/1.5, height/1.5);
    popMatrix();
  }
  angle += 0.5;
  popMatrix();

  fill(50);
  if (mode) text("RGB", (width-textWidth("RGB"))/2, (height/2) + 8);
  else text("HSB", (width-textWidth("HSB"))/2, (height/2) + 8);
}

void mousePressed() {
  mode = !mode; 
}