home/ atoms/ sdf-segment-thickness

Line-segment and curve SDFs need a thickness offset subtracted to become visible

SDFs for 1D primitives — segments, bezier curves, and similar thin shapes — return a positive distance everywhere on a blank canvas because the mathematical shape has zero width. The SDF result must be rendered with the step(0.0, -d) threshold, which would normally show nothing since no pixel is inside a zero-width line. The standard fix is to subtract a small value (e.g., 0.02) from the returned distance before thresholding: this expands the implicit boundary outward, giving the segment visible thickness. The subtracted value directly controls the rendered width. Applying smoothstep instead of step after the subtraction gives the segment a soft, glowing appearance. This pattern applies to any SDF primitive that is inherently 1D.

Examples

float d = sdSegment(uv, vec2(0.0, 0.0), vec2(0.0, 0.2));
d -= 0.02;          // give it thickness
float col = step(0.0, -d);
// or for glow:
float col = smoothstep(0.01, -0.01, d - 0.02);

Assessment

Render a segment SDF without the thickness offset and confirm it’s invisible. Then add a 0.02 subtraction. Finally replace step with smoothstep to make the segment glow.

“Currently, the segment is too thin to see in our canvas. To give the segment some thickness, we can subtract a value from the returned distance.”
corpus · shadertoy-tutorial-nathan-vaughn-inspirnathan · chunk 6