GLSL shader example

Noise Dissolve with a Burning Edge

One threshold keeps or removes a pixel; a second narrow interval adds the burning edge. Progress and edge width can be adjusted independently.

Live example

Edit the code and the preview updates as you type.

What to observe

Noise Dissolve with a Burning Edge.

Mechanism

One threshold keeps or removes a pixel; a second narrow interval adds the burning edge. Progress and edge width can be adjusted independently.

The controlling code

float n=fbm(uv*9.);float threshold=u_parameter;float mask=step(threshold,n),edge=(1.-smoothstep(threshold,threshold+.07,n))*mask;vec3 base=palette(uv.x+uv.y*.3);c=mix(c,base,mask)+vec3(1.,.28,.04)*edge;

Experiment

Change the fire-band upper edge threshold+.07 to threshold+.15. More surviving pixels near the threshold become orange, widening the hot boundary without changing which pixels the mask removes.

Debugging and cost

Both disappearance and fire edge share the same fbm(uv*9.), evaluated once. Temporarily set c=vec3(mask); before the final output to inspect the binary keep/remove decision separately from the edge's added brightness.

Understand the technique

Built-in functions used

Learn it step by step