← back

I encountered signed distance functions (SDFs) while reading about volume rendering and wanted to understand them from first principles.

SDFs describe geometry implicitly — a point in space has a signed distance to the nearest surface, which lets you compose complex shapes with simple maths. The classic “raymarching” loop steps through this field to find intersections and compute lighting.

I found a ShaderToy example I liked, ported it to Three.js so I could work in a more familiar environment, and spent time tweaking the lighting model and the distance estimator functions. GLSL is strange at first but satisfying once the mental model clicks.