The "Mandelbulb" Background

You might have noticed the shifting, 3D geometric shape floating behind the header of my site. That isn't a video or a GIF—it's a real-time math simulation running directly in your browser.


I wrote this code using WebGL and GLSL (OpenGL Shading Language). It's a ray-marched rendering of a 3D fractal knows as a Mandelbulb.

How It Works

Unlike standard 3D graphics that use triangles and meshes, this scene is generated entirely by math equations for every single pixel on your screen. This technique is called Ray Marching.

For every pixel, the code shoots a "ray" from a virtual camera into the scene. It steps forward until it hits the fractal surface defined by a complex mathematical formula.


The Equation

The shape is powered by an iterative formula similar to the famous 2D Mandelbrot set, but extended into 3 dimensions using spherical coordinates (power 8):


v = v^8 + c

Why I Built It

I believe that leadership in technology requires understanding the "metal" underneath. While I spend much of my time on strategy, policy, and team building, I remain a builder at heart.

Writing shaders is a practice in optimization and pure logic—getting thousands of calculations to run in milliseconds (60 times a second!) reminds me that efficiency and elegance matters.

Code Snippet (GLSL)

// The distance estimator function found in my script.js
float mandelbulb(vec3 p) {
    vec3 z = p;
    float dr = 1.0;
    float r = 0.0;
    for(int i=0; i<8; i++){
        r = length(z);
        if(r > 2.0) break;
        // Convert to polar coordinates...
        // Iterate...
    }
    return 0.5 * log(r) * r / dr;
}