Color 2D texture with noise

Processing Coding Questions
1

Howdy! I am doing a background with noise adapting a code from here and I would like to control color to do something as you can see on my pictures, but I don’t understand it as good as I need for that. I can get some crazy results changing values of the three rgb channels, but I can’t do a soft pink background, for example, or a light yellow and pink background, or another things that I want to do. Could you please help me with that? Thanks!

ruido2
ruido2983×979 117 KB

ruido
ruido983×979 62.6 KB 

float t = 0;
float rez = 0.005;
size(1000,1000);

  background(220);
  noStroke();
  for(float i = 0; i < height; i+=3){
    for(float j = 0; j < width; j+=3){
      float n = noise(i*rez,j*rez, t);
      float n1 = noise(j*rez, t, i*rez);
      float n2 = noise(t,j*rez,i*rez);
      fill(n*0, n1*255, n2*255);
      rect(i,j,3,3);
    }
    t += 0.0003;
  }
2

Hello,

Consider using the HSB colorMode() and vary the hue, saturation and brightness.

References:

Example using the hue:

float t = 0;
float rez = 0.005;

size(1000, 1000);
colorMode(HSB, 360, 100, 100);

background(220);
noStroke();
for(float i = 0; i < height; i+=3){
  for(float j = 0; j < width; j+=3){
    float n = noise(i*rez,j*rez, t);
    //float n1 = noise(j*rez, t, i*rez);
    //float n2 = noise(t,j*rez,i*rez);
    //fill(n*0, n1*255, n2*255);
    fill(n*360, 100, 100);
    rect(i, j, 3, 3);
  }
  t += 0.0003;
}

image
image1002×1032 96.4 KB

:)

1 Like
3

Thanks! Is not a bad idea because It makes so easy get light colors changing brighness. But changing hue does not work so good because It gives you two or three colors that are not always the colors that you want to use on your canvas. You always have to use three nearby colors in color wheel, that is a limitation too hard. How could I win more control choosing the palette?

4

Hello,

Make use of the map() function.

 float hue = map(n1, 0, 1, 0, 60);
 stroke(hue, 50, 100);
 point(i, j);

image

 float hue = map(n1, 0, 1, 60, 120);
 stroke(hue, 50, 100);
 point(i, j);

image

:)

2 Likes
5

Thanks! Supposing that I can drive that, how can I get transparency for new elements with HSB ?

6

Hello,

Take a look here:

There is a link in there to bit shifting in the reference which helps to manipulate the values.

And here:

:)

1 Like