Hue with specific colors


#1

Hi, so I’m working on a school project and basically I want the option for hue in the background. I am able to get a horizontal hue with all the colours, but I was hoping to do a vertical hue with a specific set of colours. Is that possible and if so how do I do that?


#2

Hi,

I don’t quite understand what you want to do. Maybe you can post a simple picture made with paint or photoshop?

Also post the code you already have, people will be more willing to answer.


#3

Basically my main concern is limiting the colors to shades of light blue/green, rather than all of the available options. The code I’m following comes directly from the processing website,

int barWidth = 20;
int lastBar = -1;

void setup() 
{
  size(640, 360);
  colorMode(HSB, height, height, height);  
  noStroke();
  background(0);
}

void draw() 
{
  int whichBar = mouseX / barWidth;
  if (whichBar != lastBar) {
    int barX = whichBar * barWidth;
    fill(mouseY, height, height);
    rect(barX, 0, barWidth, height);
    lastBar = whichBar;
  }
}

#4

Please edit your last post and format your code.

You can use the map function to set (and limit) the hue (so the color). For example limiting the hue between the values 100 and 200 give the following result:

int barWidth = 20;
int lastBar = -1;

void setup()
{
  size(640, 360);
  colorMode(HSB, height, height, height);
  noStroke();
  background(0);
}

void draw()
{
  int whichBar = mouseX / barWidth;
  if (whichBar != lastBar) {
    int barX = whichBar * barWidth;
    float hue = map(mouseY, 0, height, 100, 200); // Added line
    fill(hue, height, height);
    rect(barX, 0, barWidth, height);
    lastBar = whichBar;
  }
}

#5

Awesome, got the exact result I wanted! Thanks!!!


#6

You might also be interested in lerpColor, which can be used to produce different hue gradients by modifying the input colors.

https://processing.org/reference/lerpColor_.html

A recent lerpColor sketch: