Lighting and shading raymarched SDF surfaces

This module is where your sculpted SDF scene stops looking like a flat silhouette and starts looking like film. On a live-visuals rig — a single fullscreen fragment shader hot-reloading behind the music — lighting is the highest-leverage move you own: the same geometry reads as noon, dusk, or dream depending on how you shade it, and an audience feels that shift instantly even projected in a dark room.

The arc starts fully supported: light a single sphere. Since an SDF has no vertex normals, you first estimate them by sampling the gradient at nearby points (“Raymarching surface normals are estimated by sampling the SDF gradient”), then wire up the clamped normal-dot-light Lambert term and stack ambient, diffuse, and specular Phong-style. These two moves — normals and the diffuse dot product — recur in every shading line you will ever write, so they run as drills inside the whole task rather than in isolation. Next you march a second ray toward the light for shadows, upgrade it to soft penumbras by tracking how close the ray grazes occluders, and cheaply darken crevices with normal-offset ambient occlusion. Finally you go cinematic: the outdoor three-point rig (yellow sun key, blue sky fill, warm ground bounce), warm-tinted penumbras instead of grey ones, and hand-painted fake bounce light where physics would be too expensive.

Every required atom is a gate: skip any one and the capstone visibly fails — no normals, no shading; no penumbra tracking, no soft shadows; no painted light, no cinema. Supporting atoms deepen the look — colorized occlusion, fake subsurface rims, sky reflections, sane albedo values — and connect this shader craft to the BRDF and microfacet theory behind full physically based rendering.

Runnable examples

Generated from the context/ instrument corpus by concept (redistributable idioms only). Do not edit — regenerate with gen-module-examples.mjs.

gradient-ramp

gradient(0.3).out()

_{hydra-0170 · MIT}

[fr, fr*0.5, 1-fr] >> rgb

_{punctual-0033 · CC0-1.0}

surface-shading

float diff = max(dot(n, normalize(L)), 0.0); col *= diff;

_{glsl-0117 · public-domain}