How to create a Mandelbulb

I’m trying to make a mandelbulb like: . Admittedly this is probably a bit advanced for my math/3d/glsl skillset, however i’m not really sure where to start within BabylonJS. Would this be a just ultimately be a shader/computershader? If anyone has an example within babylonjs that would be great.

You can make it a post-process shader using raymarching like here:

Here is an example with BabylonJS:

Basically you only need a position and the inverse of the camera view and projection as uniforms


Thank you so much for the quick response! For my edification, could you explain why post-process shader is what you should use?

No problem :wink:

Post-process is the way to go for the Mandelbulb because we want to use raymarching instead of regular rasterization.

If the bulb had been made of triangles, it would have been rendered with the other meshes, but then your resolution is limited because you can only render so many triangles. If you were to zoom of your mandelbulb mesh, it would become flat and you would notice the individual triangles, which is not what we want for a fractal that is supposed to have infinite details.

Raymarching does not have these issues (there are other issues though ^^)

In raymarching, you shoot rays from the camera (typically one ray per pixel) which can be done in a pixel shader or a compute shader, hence we use post-process. Instead of creating a mesh with billions of vertices, raymarching only scales with the resolution of your screen.
As you use the implicit representation for the Mandelbulb (its signed distance function), you can get as much details as you want, which would have not been possible with a regular mesh.

Let me know if that answers your question


Great information. Yes that answered my question! Thanks again :slight_smile:

1 Like