Perlin 3D noise working correctly?

I am working on a little sketch that uses 3d perlin noise:

Essentially, it’s just a moving background. I noticed, that there is some kind of rythmic motion going on… Hard to explain, but I think you’ll notice as well. Is 3d perlin noise supposed to work that way? I was expecting a more random, wave-like motion… How can I avoid this?


1 Like

Hi @Kubi,

How about using a 2d Perlin noise instead and adding (or subtracting) the zOff variable to the x and y coordinates of your noise space ?

n = noise(xOff + zOff, yOff + zOff);

The orientation of the wave motion will vary depending on where you chose to add/subtract your zOff variable:

  • increment/decrement the xOff only = horizontal motion
  • increment/decrement the yOff only = vertical motion
  • increment/decrement both = diagonal motion
1 Like

Hi @solub,

thanks for the reply! However, that is not what I mean… I don’t want waves moving across the canvas, I want random “highlights” appearing independently of each other… If you look at my sketch with unchanged settings, everything seems to change simultaneously every half second or so… The highlights seem to appear and disappear in some kind of pulsing motion all at once… Hard to explain what I mean :confused:

I think I understand what you mean.

Have you tried with OpenSimplex noise instead ? My guess is that you will probably get a smoother motion with it.

You can import it in your index.html folder with:

<script src=""></script>

then adding to your sketch:

var simplex = new SimplexNoise();

n = simplex.noise3D(x, y, z); 
n = simplex.noise2D(x, y);

thanks @solub, I’ll look into that!

@solub you were right, Daniel Shiffmann mentions the same issue in this video at around 3:30


For more on Perlin vs Simplex noise – and in in-depth comparison of their outputs – see also: Perlin vs Simplex noise performance

(That is for Processing (Java mode), but still relevant)